Nuxt3踩坑记 - 使用keep-alive

Nuxt3的变化太频繁了，很多其他人写的文章都已经失效了。。。本文章写于2023.7.7，nuxt版本为3.0.0。

简单方法：

现在想要让某个页面是keep-alive的，只需要在那个页面中加一句这个代码就行。

比如我想让/search是KeepAlive的，那么就是 在/pages/search.vue中，加上这句代码

<script lang="ts" setup>
definePageMeta({
    keepalive: true//设置为keepAlive
})
</script>

注意，使用了keep-alive的页面，如果你想让你的组件每次显示/关闭都进行操作的话，需要使用onActivated和onDeactivated （而不是onMounted和onUnmounted）

官网文档：pages/ · Nuxt Directory Structure

其它写法：