parentComponent.ctx.deactivate is not a function

vue3中使用 keep-alive报错

TypeError: parentComponent.ctx.deactivate is not a function

代码:

<router-view #default="{ Component, route }">
          <keep-alive>
            <component :is="Component" v-if="route.meta.keepAlive" />
          </keep-alive>
          <component :is="Component" v-if="!route.meta.keepAlive" />
        </router-view>

只有一个文件缓存时,不会报错,多个需要缓存时就报错.所以使多个缓存数据需要指定 key

这个key,不要用 :key="Component"  虽然不会报错了,但是缓存不起作用

使用router定义的path或者name

<router-view #default="{ Component, route }">
          <keep-alive>
            <component
              :is="Component"
              :key="route.path"
              v-if="route.meta.keepAlive"
            />
          </keep-alive>
          <component :is="Component" v-if="!route.meta.keepAlive" />
        </router-view>

这样就可以了