解决keep-alive缓存失效问题【必看!!!】

最近正在使用Vue3+Ts+Pinia重构后台管理项目,在写到路由缓存时,发现怎么都缓存不了,后来才找到了原因:

Vue3中的setup语法糖中的name命名无效

即:如果你是按如下写组件的name,是不起作用的

<script name="One1"  lang="ts" setup>

</script>

解决方法有两种

1)手动写一个script标签,然后默认暴露名称

<script lang="ts">
export default {
  name:'One1'
}
</script>
<script  lang="ts" setup>

</script>

 2)使用vite-plugin-vue-setup-name-support插件,这个插件是用来解决vue3 setup 语法糖中无法给组件命名的缺陷

插件地址:vbenjs/vite-plugin-vue-setup-extend - Vite 中文文档 (viterc.cn)icon-default.png?t=N6B9https://www.viterc.cn/en/vite-plugin-vue-setup-extend.html

猜你喜欢

转载自blog.csdn.net/weixin_48975022/article/details/132311613