vc-keep-alive不单单像App那样前进刷新, 返回销毁

deepkolos.github.io/vc-keep-ali…

解决的痛点

子路由的更新和父级路由无关, 因此一级路由的缓存 key 是命中路由的父一级路由相关, 目前是 父路由的 path + 父子路由相同的 params

还有功能性路由的支持

    好比使用支持返回键的 imgsViewer, 须要 history 压栈而不触发 forward/backward 事件,  因此提供了 ignorePaths 参数

   好比子路由使用 router-view 来渲染, 而是使用 view-pager 来自行控制,

支持左右滑动切换, 若是 view-pager 的页面状态是须要保存到 url, 则须要一级路由的一个动态路由占位符, 充当子路由, 因此提供了 ignoreParams 参数

watch$route/activated/配置一个key不就行了么?

watch$route/activated都是不会重建建立组件, 可是能够响应路由更新, 去从新调用api拉取新数据, 可是想要页面过渡动画就实现不了了

网上也有简单的配置key为$route.path/fullPath, 可是有缺点:

0. 若是仅仅是命中路由的子路由部分变化了, 父路由关联的组件也是会被从新建立, 好比: /page/tab-0 -> /page/tab-1 时, 位于/home的组件也会被从新渲染一次

1. 路由一旦缓存了就只能max来触发清除缓存, 想实现返回销毁的话, 只能经过route hook里面 去判断前进返回, 而后再手动调用instance.$destory(), 可是问题是keepAlive组件的缓存依然没有销毁的标记, 这样的就会致使第一次返回是销毁了, 可是当再次前进到另外一个页面的时候, 再返回则会命中的缓存是旧的缓存, 然而该缓存已经destoryed, 后面仍是会从新建立一次 

好比: / -> /page-1/0 -> / -> /page-1/0 -> /page-1/1 -> /page-1/0(从新建立了)

因此vc-keep-alive是针对以上问题解决方案的配置打包, 不过如今尚未对addRoutes的支持, 晚点补上