docs: bigger api example router view slot

diff --git a/docs/api/index.md b/docs/api/index.md
index ef678e48948bb81c35ab7eb238771401572a2c20..99a6bedd8037b46dff50639f36c17da7d9156518 100644 (file)
--- a/docs/api/index.md
+++ b/docs/api/index.md
@@ -168,9 +168,21 @@ If you add a `target="_blank"` to your `a` element, you must omit the `@click="n
 `<router-view>` exposes a `v-slot` API mainly to wrap your route components with `<transition>` and `<keep-alive>` components.
 
 ```html
-<router-view v-slot="{ Component, route }">
-  <component :is="Component" />
-</router-view>
+<Suspense>
+  <template #default>
+    <router-view v-slot="{ Component, route }">
+      <transition :name="route.meta.transition || 'fade'" mode="out-in">
+        <keep-alive>
+          <component
+            :is="Component"
+            :key="route.meta.usePathKey ? route.path : undefined"
+          />
+        </keep-alive>
+      </transition>
+    </router-view>
+  </template>
+  <template #fallback> Loading... </template>
+</Suspense>
 ```
 
 - `Component`: VNodes to be passed to a `<component>`'s `is` prop.

diff --git a/docs/zh/api/index.md b/docs/zh/api/index.md
index 7aec807b2fb50cd7001602e50ac7da8618c436b8..47b3eb33ab56823eeb10bb6c8959e2cf75dba603 100644 (file)
--- a/docs/zh/api/index.md
+++ b/docs/zh/api/index.md
@@ -168,9 +168,21 @@ sidebar: auto
 `<router-view>` 暴露了一个 `v-slot` API，主要使用 `<transition>` 和 `<keep-alive>` 组件来包裹你的路由组件。
 
 ```html
-<router-view v-slot="{ Component, route }">
-  <component :is="Component" />
-</router-view>
+<Suspense>
+  <template #default>
+    <router-view v-slot="{ Component, route }">
+      <transition :name="route.meta.transition || 'fade'" mode="out-in">
+        <keep-alive>
+          <component
+            :is="Component"
+            :key="route.meta.usePathKey ? route.path : undefined"
+          />
+        </keep-alive>
+      </transition>
+    </router-view>
+  </template>
+  <template #fallback> Loading... </template>
+</Suspense>
 ```
 
 - `Component`: 要传递给 `<component>` 的 VNodes `是` prop。