路由缓存-之-keep-alive

transition动画没配置而包裹keep-alive，会影响缓存的配置使用 通过isKeep 字段渲染

 <router-view v-slot="{ Component, route }">
            <!-- <transition :name="route.meta.transition || 'fade-transform'" mode="out-in"> -->
            <keep-alive>
              <component :is="Component" v-if="route.meta.isKeep" :key="route.path" />
            </keep-alive>
            <component :is="Component" v-if="!route.meta.isKeep" :key="route.path" />
            <!-- </transition> -->
  </router-view>

router实例

import { RouteRecordRaw } from 'vue-router';
const routes: Array<RouteRecordRaw> = [
  {
    path: '/caseComment',
    name: 'caseComment',
    meta: {
      title: 'XXXX',
      permission: '/XXXX',
      : true
    },
    component: () => import(/* webpackChunkName: "example" */ '@/views/XXX/index.vue')
  },
  {
    path: '/caseReply',
    name: 'caseReply',
    meta: {
      title: '测试',
      permission: '/XXX',
      isKeep: false
    },
    component: () => import(/* webpackChunkName: "example" */ '@/views/XXXX/index.vue')
  }
];
export default routes;