vue通过路由实现对部分组件进行缓存(keep-alive)

首先在router中,设置meta属性keepAlive

{
	path:'/svglink',
	name: 'svglink',
	component: () => import('@/components/SvgMain/SvgLink.vue'),
	meta: {
	     keepAlive: true
	 }
 },

然后在组件中,通过v-if将需要缓存的组件放到keep-alive中去

<div class="app-container">
	<keep-alive>
     	<router-view v-if="$route.meta.keepAlive"/>
	</keep-alive>
    	<router-view v-if="!$route.meta.keepAlive"/>
 </div>

猜你喜欢

转载自blog.csdn.net/weixin_43374193/article/details/89358881