需求介绍：
// 缓存需求：
// 1. 从列表中访问页面清除缓存
// 2. 详情页返回页面缓存
// 3. 新增返回页面清除缓存
// 4. 编辑返回页面缓存但调用接口
// 5. 多个嵌套页面缓存问题
设计实现步骤：
1，在路由文件添加一个变量控制当前组件是否需要缓存，比方说：
上图中keepAlive变量就是控制当前组件是否需要缓存
2，在app.vue中根据this.$route.meta.keepAlive的值来判断走哪个分支，比方说
hook方法用来监听组件生命周期的回调函数
3，使用vueX对需要缓存的组件路由进行存储，存储方式参考：
（1）当列表需要缓存的时候，keep-alive处于激活状态时，即activated触发的时候，判断当前路由是否存在缓存列表中，存在返回当前对象
（2）根据当前对象中condition和pv判断是否需要清空查询条件，缓存列表（这里目前只加了初始化详情的逻辑，对于新增和编辑condition状态为"add"和"update"的逻辑没有添加）
进阶版：
(3）跳转详情之后返回列表页，在详情组件的beforeRouteLeave中，对列表页的缓存对象进行更新
更新方法：
新增和编辑的时候也可以对组件的缓存进行更新，比方说可以通过如下方式更新
4，当重新刷新缓存页面，或者跳转其他页面之后在回到当前页面之后，没有及时加入缓存的问题，在上面keep-alive包裹的router-view触发hook回调函数，监听组件的生命周期created，
判断当前路由组件的keepAlive变量为true，并且store中缓存数组caches为空的时候，初始化缓存数组caches
初始化的【handleCache】方法：
总之，先设置缓存变量，根据变量判断是否需要keep-alive包裹，结合activated， beforeRouteLeave以及vueX添加更新缓存的逻辑，同时利用hook解决初始化的问题。