keep-alive保持页面状态及相关两种属性

一.使用keep-alive保持页面状态

我们发现页面在每次点击时都会被created，而当点击其他页面时，原页面就会被destoryed。即每次重新点击原页面时，都是重新创建一个新页面。
若我们希望，当跳转到其他页面后，再次返回原页面时，能够保留之前的内容，该怎么办呢？

• 答：此时可以考虑用<keep-alive>标签保持状态，让页面不用每次都被创建

1.首先在App.vue中添加keep-alive标签

2.其次在对应路由组件中，创建activated和beforeRouteLeave方法，记录当前的路径

注意：activated()和deactivated()只有在该组件被保持了状态，即使用keep-alive标签时，才是有效的

二.keep-alive的两个属性

• include: 字符串或正则表达式，只有匹配的组件会被缓存
• exclude:字符串或正则表达式，任何匹配的组件都不会被缓存