含义:keep-alive为了防止不活动的组件重新渲染,会把它们缓存到内存中,而不是销毁,然后重新渲染。
keep-alive有哪些属性?
include:包含哪些需要被缓存的组件
exclude:除开之外,哪些不需要包含的组件
max:最多可以缓存的组件数量
如果什么属性都不填的话就是直接缓存标签内所有的,常见的就是缓存所有组件,一般在App.vue中
<template>
<div id="app">
<keep-alive>
<router-view/>
</keep-alive>
</div>
</template>
<script>
export default {
name: 'App'
}
</script>
使用include和exclude属性
// 组件name为test才会被缓存
<keep-alive include='test'>
<router-view/>
</keep-alive>
// 组件name为test的不会被缓存
<keep-alive exclude='test'>
<router-view/>
</keep-alive>