vue keep-alive不生效

• Z时代
• 2024-02-23
• 分类：IT

// dataCenter/index.vue
<script>
export default {
  name: 'dataCenter'
}
</script>
// App.vue
<template>
  <div id="app">
    <keep-alive include="dataCenter">
      <router-view />
    </keep-alive>
  </div>
</template>
// router/index.vue
{
    path: '/dataCenter',
    component: Layout,
    children: [
      {
        path: '/dataCenter',
        name: 'dataCenter',
        component: () => import('@/views/dataCenter/index'),
        meta: { title: '', icon: 'icon-shujuku', keepAlive: true }
      }
    ]
  }

使用keepAlive也不生效

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

回答：

你这种路由写法，keepalive应该写在layout中，而不是app.vue中，访问的路径也是/datacenter/datacenter

以上是 vue keep-alive不生效 的全部内容， 来源链接： utcz.com/p/937593.html