vue组件缓存keep-alive

什么是keep-alive？

1.keep-alive其实是vue.js自带的内置组件，它会缓存页面以及缓存当前页面的数据状态，不是销毁这个组件。不会被渲染到真是DOM中也不会出现在父组件中，总的来说就是当你跳转其他页面时，在返回你跳转之前的页面时写的内容数据还在。

keep-alivena怎么使用？

它自带两个属性：include和exclude

1.include属性就是把要缓存的组件名称放到里面，然后vue就会自动缓存

代码如下：

<div>
    <keep-alive include="要缓存的组件名称">
        <router-view></router-view>  // 子路由显示
    </keep-alive>
</div>

2.exclude属性恰恰相反，它是你填写的组件不会缓存，其余组件都会被缓存

代码如下：

<div>
    <keep-alive include="不想被缓存缓存的组件名称">
        <router-view></router-view>  // 子路由显示
    </keep-alive>
</div>