getCurrentInstance().ctx.$refs.keepAlive.$.__v_cache, can not run in prod
What problem does this feature solve?
When I want to close tabs, I delete the corresponding route cache in this way
What does the proposed API look like?
<router-view v-slot="{ Component, route }"> <keep-alive ref="keepAlive"> <component :is="Component" :key="route.fullPath" v-if="$route.meta?.keepAlive" /> </keep-alive> <component :is="Component" :key="route.fullPath" v-if="!$route.meta?.keepAlive" /> </router-view>
<script lang="ts" setup> const ins = getCurrentInstance() as any; let removeCache: Function; onMounted(() => { removeCache = (key) => { const keepAliveInstance = ins.ctx.$refs.keepAlive.$; const cache = keepAliveInstance.__v_cache; cache.delete(key); }; }); </script>
The tabs tag close event executes this function, delete the corresponding route cache in this way