分类
keep-alive页面缓存及setup问题
Vue框架
2026-07-31
2

加上缓存

不需要指定组件,全部缓存的情况删除include即可

<router-view v-slot="{ Component }">
  <transition name="fade" mode="out-in" appear>
    <keep-alive :include="store.cachedComponents">
      <component :is="Component" />
    </keep-alive>
  </transition>
</router-view>

不生效问题

由于加上了include后需要指定组件的name属性,而setup中无法直接写,需要加上插件

npm install vite-plugin-vue-setup-extend

然后在vite.config.js中配置

import VueSetupExtend from 'vite-plugin-vue-setup-extend'

export default defineConfig({
  plugins: [
    vue(),
    VueSetupExtend()
  ]
})

最后在组件上使用

<script name='testAddName'></script>
目录
统计
21
分类
39
文档
1
坚持