这是VUE官方示例代码:
<router-view v-slot="{ Component }">
<keep-alive>
<component :is="Component" v-if="$route.meta.keepAlive"/>
</keep-alive>
<component :is="Component" v-if="!$route.meta.keepAlive"/>
</router-view>
但是在tab页面切换时极大概率会报错: TypeError: parentComponent.ctx.deactivate is not a function
解决方案:
将代码改为如下(在keep-alive内的 component 上增加 key 属性):
<router-view #default="{ Component, route }">
<keep-alive>
<component :is="Component" :key="route.name" v-if="route.meta.keepAlive"/>
</keep-alive>
<component :is="Component" :key="route.name" v-if="!route.meta.keepAlive"/>
</router-view>
如果还报错,设置VUE-CLI的配置项,关闭热更新:(vue.config.js)
devServer: {
hot: false, //true开启
}
————————————————
版权声明:本文为CSDN博主「qq_15197419」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:blog.csdn.net/qq_15197419/article/details/123005480