N
Nuxt•7mo ago
Usopp

Remove pages from keep-alive

Remove pages from keep-alive
2 Replies
kapa.ai
kapa.ai•7mo ago
Hi @Usopp. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- To remove specific pages from being cached by <KeepAlive> (i.e., to exclude them from keep-alive) in Nuxt, you can use the keepalive.exclude property. This can be set either via the <NuxtPage> component or in the definePageMeta of your page components. Example using <NuxtPage> in your layout or app.vue: 
<script setup lang="ts">
const exclude = ['cpage', 'dpage'] // Names of the pages to exclude from keep-alive
</script>

<template>
  <NuxtLayout>
    <NuxtPage :keepalive="{ exclude }" />
  </NuxtLayout>
</template>
<script setup lang="ts">
const exclude = ['cpage', 'dpage'] // Names of the pages to exclude from keep-alive
</script>

<template>
  <NuxtLayout>
    <NuxtPage :keepalive="{ exclude }" />
  </NuxtLayout>
</template>
This ensures that the pages named cpage and dpage will not be cached by <KeepAlive>. Make sure the exclude array is defined outside the template to avoid unnecessary cache pruning, as recreating the array on each render can cause issues with the cache management in <KeepAlive> fix(nuxt): prevent cache reset on excluded pages and solve transition warning. Alternatively, you can set keepalive options in definePageMeta: 
<script setup lang="ts">
definePageMeta({
  keepalive: {
    exclude: ['modal']
  }
})
</script>
<script setup lang="ts">
definePageMeta({
  keepalive: {
    exclude: ['modal']
  }
})
</script>
This will exclude the modal page from being cached when switching between components definePageMeta examples. Summary:
- Use the exclude property in the keepalive option to specify which pages should not be cached. - Define the exclude array outside the template to prevent cache issues. For more details, see the official documentation and related PRs NuxtPage API, definePageMeta examples, and fix(nuxt): prevent cache reset on excluded pages and solve transition warning. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai•7mo ago
<@329410068447625220> Kapa.ai is still learning and improving, please let me know how I did by reacting below.

Did you find this page helpful?