Vue页面跳转,从A页面跳转到B页面,再从B页面跳转到A页面

Question

问题描述A页面有input框，输入了之后，然后点击查询按钮，展现的查询结果为一个echart图表折线图，此时浏览器地址为/a，在echart图表上有点击事件，点击后跳转到B页面,浏览器地址为/a/b。现在点击浏览器后退的箭头，要回到/a页面，并且要让A页面的图表折线图还存在。问题出现的环境背景及自己尝试过哪些方法在router.js中A页面的路由设置了meta的keepAlive为true相关代码// 请把代码文本粘贴到下方（请勿用图片代替代码）//A页面router.js中的{ path: '/a', component: A, name: 'A', meta: { keepAlive: true } },// A.vue页面的<template><keep-alive><div ...></div></keep-alive></template>//B页面在methods之后，beforeRouteLeave (to, from, next) {to.meta.keepAlive = truenext()},你期待的结果是什么？实际看到的错误信息又是什么？从B页面回到A页面时候，A页面的echart表还存在

Answer 1

 <keep-alive v-if="route.meta.isAlive">
  <router-view></router-view></keep-alive>

Answer 2

可以看看keepAlive的include、exclude属性，比用v-if判断是否缓存灵活许多。。
在vuex里加一个include数组，keepAlive的include属性绑定此数组，A页面的beforeRouteLeave里判断to的页面，如果to.path指向的是B页面的path，include数组里添加B页面组件的name，如果不是，include数组去掉B页面组件的name