keepAlive 实现的保活

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

route/index.js   路由里添加meta元数据
 {
    path: '/about',
    name: 'About',
    component: () => import('../views/About.vue'),
    // 元数据meta, 用于自定义属性
    meta: {
      // 属性名随意
      keepAlive: true, //代表 保持活动
    },





 <!-- 占位符 -->
    <!-- 默认情况下, 路由会自动节省内存: 只保存当前显示的组件, 切换掉的组件 会自动销毁 -->
    <!-- keep-alive: 保持-存活 简称 保活 -->
    <keep-alive>
      <!-- 判断: 如果当前路由是保持活动, 则显示这个router-view -->
      <router-view v-if="$route.meta.keepAlive" />
      <!-- 没有在meta中声明 keepAlive属性, 则值是 undefined -->
      <!-- if判断 会认为是false -->
    </keep-alive>
    <!-- 如果不存在 keepAlive属性, 则显示此处, 不需要保活 -->
    <router-view v-if="!$route.meta.keepAlive" />

在mintui保活状态下  鼠标滚动 bug 一直加载数据

 activated() {
    console.log("/home/index activated..");
     this.isLoading = false; //启用曲线滚动
  },
  deactivated() {
    console.log("/home/indexdeactivated......");
     this.isLoading = true; //禁用无限滚动
  },

keep-alive 详细地址 ：

多组件保活 必须是组件注册的名    例如： News.vue  Mes.vue

<keep-alive  :include="[  '  News ','  Mesage  ' ]">       </keep-alive>

（2）vue通过include实现动态配置缓存路由_又走神了的博客-CSDN博客_vue的include动态配置路由给路由添加缓存标志切换页面时将路由路径存到vuex内使用添加需要缓存的路由下面用到的组件在之前有过介绍，有需要的话可以看一下之前的内容给路由添加缓存标志// router.jschildren: [ { path: '/testA/testA', meta: { title: '组件一', icon: 'el-icon-user-solid', https://blog.csdn.net/weixin_42283712/article/details/108667603?utm_term=vue%E7%9A%84include%E6%96%B9%E6%B3%95&utm_medium=distribute.pc_aggpage_search_result.none-task-blog-2~all~sobaiduweb~default-1-108667603&spm=3001.4430