Vue Suspense 搭配RouterView只在首次显示fallback? 进来看看解决你的问题。

先看看官方默认实例

<RouterView v-slot="{ Component }">
  <template v-if="Component">
    <Transition mode="out-in">
      <KeepAlive>
        <Suspense>
          <!-- 主要内容 -->
          <component :is="Component"></component>

          <!-- 加载中状态 -->
          <template #fallback>
            正在加载...
          </template>
        </Suspense>
      </KeepAlive>
    </Transition>
  </template>
</RouterView>

结果只在第一次刷新时出现了加载提示！！！

翻遍百度也无果之后.

查看源码

还有两个参数可选

timeout suspensible

再次尝试

 <RouterView v-slot="{ Component, route }">
    <template v-if="Component">
      <Transition mode="out-in">
        <KeepAlive>
          <Suspense timeout="0">
            <component :is="Component" :key="route" />
            <template #fallback>
              正在加载...
            </template>
          </Suspense>
        </KeepAlive>
      </Transition>
    </template>
</RouterView>

实现了预期效果每次都出现了加载效果

<Suspense timeout="0">

<component :is="Component" :key="route" />