vue3 页面缓存

App.vue文件
<template>
  <div>
    <router-view v-slot="{ Component }">
      <keep-alive>
        <component v-if="$route.meta.keepAlive" :is="Component"/>
      </keep-alive>
      <component v-if="!$route.meta.keepAlive" :is="Component"/>
    </router-view>
  </div>
</template>

路由文件
{
    path: '/abc',
    name: 'Abc',
    component: () => import('../views/Abc/index.vue'),
    meta: {
      nav: true,
      title: '路由名',
      keepAlive:true
    }
  },

相关生命周期函数：

onActivated()

onDeactivated()

转载：blog.csdn.net/qq_47247479…

啊！！！这是什么意思 component我知道怎么用 router-view我知道怎么用加一起是啥？ slot个啥？

component动态渲染组件这个理解吧 slot插槽这个理解吧 router-view这个用过吧 接下来上总结

这是路由router 意思就是当前路由地址为login的时候 获取到他的component 也就是Login组件 也就是渲染名为Login的组件