cssmagic/Nuxt-Notes

Nuxt 3 笔记:状态管理

cssmagic opened this issue · 0 comments

概述

useState() 是一个对 SSR 友好的 ref() 的替代品。它的值在 SSR 之后的水合阶段仍然都会保留,可通过唯一 key 被所有组件共享。

这个组合式函数仅在 setup 阶段和生命周期钩子内可用。

由于 state 需要传递到客户端,它的内容必须是可序列化为 JSON 的。因此不应该用它来保存 Class、函数和 Symbol 等类型。

注意事项

不要在 setup 之外定义 const state = ref(),这种 state 会被所有访问者共享,从而导致内存泄漏。

可以换用这种方法:const useX = () => useState('x')。(待研究)

Pinia

为什么需要 Pinia:
https://www.vuemastery.com/blog/nuxt-3-state-mangement-pinia-vs-usestate/

Global State Management with Pinia In Nuxt 3:
https://vueschool.io/articles/vuejs-tutorials/global-state-management-with-pinia-in-nuxt-3/