Vue keep-alive 缓存组件的三种方式
程序员文章站
2022-06-28 19:15:37
<keep-alive>
所包裹的不活动组件,将被缓存,而不是销毁。
1. 直接包裹在里面的组件和所有路由匹配到的组件都会被缓存
<keep-alive>
<component>
// ....
</component>
<router-view />
</keep-alive>
2. 使用 include 属性和 exclude 属性对组件缓存进行筛选
<keep-alive include="a">
<component>
// ....
</component>
</keep-alive>
仅匹配到的组件(如:组件 a name = "a"
)会被缓存(仅想要缓存的组件得到缓存)
可以通过配置 exclude 匹配不想要缓存的组件,此外的其他组件都得到缓存
这种情况需要知道组件名称
3. 动态配置路由来确定哪些组件需要缓存
var router = new Router({
routes: [
{
path: '/...',
component: ...,
meta: {
keepAlive: true // or false
}
}
]
})
不需要例举想要缓存的组件名称
本文地址:https://blog.csdn.net/Kofe_Chen/article/details/107379525
上一篇: springMVC框架 对BaseCtrl封装,简化开发
下一篇: 记,当找不到图片时,显示默认图片