ARTICLE DETAIL

资讯详情

深耕网站建设、视觉设计与SEO优化的一线实战洞察。

vue3不允许缓存组件keep-alive直接包裹router-view

vue3不允许缓存组件keep-alive直接包裹router-view

从vue3开始,不再允许用keep-alive直接包裹router-view,只允许包裹component组件。

所以,要使用缓存,以前可以这么写:

<keep-alive><router-view></router-view>
</keep-alive>

从Vue3开始,这种写法不行了,但是可以作如下变通:

<router-view v-slot="{Component}">
<keep-alive><component :is="Component"></component>
</keep-alive>
</router-view>

 

总结:从router-view渲染组件解构出当前组件Component,然后再用动态组件挂载。

 

返回列表