vue 页面缓存和不缓存方法
作者:互联网
利用 <router-view></router-view> 标签页面缓存
在App.vue 中来判断各个组件是否缓存
<div id="app">
<!--缓存想要缓存的页面,实现后退不刷新-->
<!--加上v-if的判断,可以自定义想要缓存的组件,自定义在router里面-->
<keep-alive>
<router-view v-if="$route.meta.keepAlive"></router-view>
</keep-alive>
<router-view v-if="!$route.meta.keepAlive"></router-view>
<!--这里是其他的代码-->
</div>
2.在配置路由 router.js 中来控制某个组件是否需要缓存
export default new Router({
routes: [
{
path: '/',
name: 'HelloWorld',
component: HelloWorld,
meta:{keepAlive: true} // 这个组件需要缓存 true
},{
path:'/eleme',
component:Eleme,
meta:{keepAlive: false} // 这个组件不需要缓存false(不写默认不缓存)
}
]
})
标签:中来,缓存,false,vue,meta,组件,path,页面 来源: https://blog.csdn.net/qq_33866063/article/details/90751826