对路由切换想缓存组件状态，这种如何处理？

1、keep-alive 给路由组件出口套一层。

 <keep-alive>
       <router-view />
 </keep-alive>

这就可以了.............嘛 ?

no no no...

这只是开始

1、需要在路由中添加配置

  {
    path: '/about',
    name: 'About',
    meta:{
      keepAlive:false //不需要缓存的
    },
    component: () => import('../views/About.vue')
  },
  {
    path: '/index',
    name: 'Index',
    meta:{
      keepAlive:true //需要缓存的
    },
    component: () => import('../views/Index.vue')
  }

2、在路由出口添加配置

<!-- 主题部分 -->
    <div>
      <keep-alive>
        <!-- 需要缓存的 -->
          <router-view v-if="$route.meta.keepAlive"/>
      </keep-alive>
      <!-- 不需要缓存的 -->
      <router-view v-if="!$route.meta.keepAlive"/>
    </div>