vue keepalive include
时间: 2024-12-12 09:07:54 浏览: 4
解决Vue中使用keepAlive不缓存问题
Vue.js中的`<keep-alive>`组件是用于缓存动态组件实例的,当组件不再展示时将其挂起并保留其状态,以便在之后快速复原。`include`属性是一个白名单,它允许你控制哪些组件会被缓存。当你设置了`include`,只有匹配指定名称的组件会被保留在内存中。
例如:
```html
<template>
<div id="app">
<keep-alive :include="['ComponentA', 'ComponentB']">
<component :is="currentComponent"></component>
</keep-alive>
</div>
</template>
<script>
export default {
data() {
return {
currentComponent: 'ComponentA',
};
},
// ...
}
</script>
```
在这个例子中,只有`ComponentA`和`ComponentB`会在切换组件时被缓存起来,其他未包含在`include`列表内的组件将不会被缓存。
阅读全文