keep-alive保持前进刷新，后退缓存解决方案

可以实现：

a页面 =》b页面， b页面刷新。

b =》 a， a不刷新，缓存。

b =》 c ， c刷新。

c =》 b， b不刷新， 缓存。

 

实现步骤：

第一步：

npm包解决问题： https://www.npmjs.com/package/v-keep-alive-chain

第二步：

用法：npm install v-keep-alive-chain

然后在 main.js 里对该包进行引用：

Vue.use(VKeepAliveChain, {
  key: 'cacheTo' // 可选的 默认为cacheTo
})

第三步：

配置router.js, 如下：

    {
      path: '/report-detail/:mrId',
      name: 'ReportDetail',
      meta: { cacheTo: ['RegisterPage', 'DiseaseMap'], title: '病情分析报告', showTitle: true },
      component: () => import('@/views/ai-diagnosis/ReportDetail.vue')
    },

 

解释：

cacheTo数组里的，是想要进入页面的name值， 如上诉代码， 在页面 ReportDetail（a） 跳往 RegisterPage（b）页面时， b页面就会刷新，但b跳往a页面时，a不刷新。