vue 路由缓存
一般我们会在列表上使用,列表滚动到下面然后跳转详情返回还想继续显示滚动条位置
路由配置:
{ // 列表
path: '/list',
name: 'list',
component: list,
meta: {
keepAlive: true,
title: '商品列表'
}
},
app.js监听:
<template>
<div id="app">
<keep-alive>
<router-view v-if="$route.meta.keepAlive" ref="indexEvent">
<!-- 所有路径匹配到的视图组件都会被缓存! -->
</router-view>
</keep-alive>
<router-view v-if="!$route.meta.keepAlive" ref="indexEvent">
<!-- 这里是不被缓存的视图组件 -->
</router-view>
</div>
</template>
当然我们也可以使用另一种白名单的方式方式,用exclude方法定义白名单。