<keep-alive>与vue-router的结合

路由配置如下：

 {path: '/Keepline', component:  () => import('@/components/TestKeepline/Keepline.vue'),
   children:[
          {path: 'KeeplineA', name:'KeeplineA', component:  () => import('@/components/TestKeepline/KeeplineA.vue'),meta: {keepAlive: true } }, <!--缓存-->
          {path: 'KeeplineB', name:'KeeplineB', component:  () => import('@/components/TestKeepline/KeeplineB.vue'),meta: {keepAlive: true }}, <!--缓存-->
          {path: 'KeeplineC', name:'KeeplineC', component:  () => import('@/components/TestKeepline/KeeplineC.vue'),meta: {keepAlive: false}}, <!--不缓存-->
        ]
 }

<template>
    <div style="text-align: center;">
          主页
        <router-link to="/Keepline/KeeplineA">KeeplineA</router-link>
        <router-link to="/Keepline/KeeplineB">KeeplineB</router-link>
        <router-link to="/Keepline/KeeplineC">KeeplineC</router-link>

      <keep-alive>
        <router-view  v-if="$route.meta.keepAlive"></router-view>  <!--缓存的在这里显示-->
      </keep-alive>
      <router-view v-if="!$route.meta.keepAlive"></router-view> <!--不缓存的在这里显示-->
   </div>
</template>

切记被换存的组件，其 mounted 生命周期函数 只会执行一次