关于vue的keep-alive缓存页面使用$destroy后不

如标题，有个需求如下：

有三个页面A、B、C。A跳转B，B再跳转C，然后C返回B的时候B需要缓存，包括它的转跳C之前的数据与滚动的高度，然后再由B跳转回A以后，在由A页面跳转进B时需要重新刷新B的数据。

具体点：

A页面是一个商店的商品列表：

1. 本子
2. 铅笔
3. 书包

B页面是一个订单列表（如A的铅笔商品的所有订单）：

1. 订单1
2. 订单2
3. 订单3
4. 订单4
5. 订单5

C页面是订单详情（B的某个订单的详情）

订单详情页

我选择了A的铅笔，然后跳转到B，所有跟铅笔的订单列表出来了，我往下滚动找到订单5，然后点击了订单5，跳转C页面显示订单5的订单详情。
然后我从C返回B的时候，需要停留在我点击了订单5的高度以及所有数据都不能刷新。
然后我又从B返回了A，选择了本子商品跳转B，然后B要刷新成本子商品的订单列表，然后跳转C（刷新成本子选中订单的详情）

以上是需求，接下来是解决方法：

我一开始在项目上使用了keep-alive的这种方法用来区分缓存与不缓存的页面（网上找的方法）

<keep-alive>
      <router-view v-if="$route.meta.keepAlive"> </router-view>
</keep-alive>
<router-view v-if="!$route.meta.keepAlive"></router-view>

这个做法其实是错误的，除非你没有像B这样需要有两个状态的页面的时候。
然后我发现了$destory()，于是我换成了这样的做法：

<keep-alive :include="['A', 'B']">
     <router-view > </router-view>
</keep-alive>

发现只要是$destroy()以后，这个页面再也不能缓存了。。。（不知道大家有没有找到能缓存的方法，反正我没找到，找到了请告诉我一下谢谢）
然后各种beforRouteLeave各种to.fullPath各种$destroy()各种试各种@#¥%……&%¥¥#%......

然后在我脑中滋生了根据:include的['a', 'b']的变化来控制是否缓存的想法，找来找去发现好像要用到vuex管理一下状态，但是这个项目没必要再加上vuex，我就直接放弃了（是的，根本不想试一试），然后这个需求困扰了我一段时间。。
直到我突然想试一下beforRouteEnter是什么效果！

然后我就

beforeRouteEnter(to, from, next) {
      next(vm => {
          // 通过 `vm` 访问组件实例
            if (from.fullPath == '/A' && to.fullPath == '/B') {//一定是从A进到B页面才刷新
                vm.updataB();//updataB是本来写在mounted里面的各种
            }
      })
}

🎉 🎉🎉✌️ ✌️🎉✌️✌️ 🎉 🎉 🎉 🎉 🎉🎉
我突然的就成功了✌️✌️
代码如下：

//App.vue的template
<keep-alive :include="['A', 'B']">
    <router-view > </router-view>
</keep-alive>

//B.vue，温馨提示：beforeRouteEnter与mounted同级哦，不是在methods里面的，很多新手不知道该往哪里放，比如以前的我
beforeRouteEnter(to, from, next) {
     next(vm => {
         // 通过 `vm` 访问组件实例
           if (from.fullPath == '/A' && to.fullPath == '/B') {//一定是从A进到B页面才刷新
               vm.updataB();//updataB是本来写在mounted里面的各种东东
           }
     })
}

好的以上，大家要是发现有什么奇怪的地方请多指教。