Vue3-43-组件- 组件状态保持 KeepAlive 的简单使用

作用说明

一个应用场景 ：
当我们在进行路由跳转的时候，会用到 <router-view> 来作为 组件渲染的出口， 此时，组件的状态是不会被保持的。
比如 ： 当前在【组件A】中有一个响应式状态 num 的值通过 自加的方式 从初始值0 变成了 100；
然后跳转到 【组件B】，
再次跳转 回到 【组件A】 的时候，num 的值会 恢复为初始值 0。

如何实现 回到 【组件A】的时候，仍然保持 num 的数据状态为 100 呢？
这就是本文要介绍的 KeepAlive 组件的作用。
它就是用来做组件状态保持的，或者叫做 缓存组件实例。

KeepAlive的简单介绍

1、 直接使用 <keep-alive> 标签，将目标组件包起来，就实现了组件的缓存；

2、配合路由的时候，需要