useState

源文件
useState 可组合项创建了一个响应式的、对 SSR 友好的共享状态。

使用

// Create a reactive state and set default value
const count = useState('counter', () => Math.round(Math.random() * 100))
在文档 > 4.x > 入门 > 状态管理中了解更多。
因为 useState 中的数据将被序列化为 JSON，所以它不能包含任何无法序列化的内容，例如类、函数或符号。
useState 是一个由编译器转换的保留函数名，所以你不应该将自己的函数命名为 useState。

使用 shallowRef

如果你不需要你的状态是深度响应式的，你可以将 useState 与shallowRef结合使用。当你的状态包含大型对象和数组时，这可以提高性能。

const state = useState('my-shallow-state', () => shallowRef({ deep: 'not reactive' }))
// isShallow(state) === true

类型

签名
export function useState<T> (init?: () => T | Ref<T>): Ref<T>
export function useState<T> (key: string, init?: () => T | Ref<T>): Ref<T>
  • key：一个唯一的键，确保跨请求的数据获取正确去重。如果你不提供键，那么将为你生成一个在文件和 useState 实例的行号上唯一的键。
  • init：一个函数，在状态未初始化时提供初始值。这个函数也可以返回一个 Ref。
  • T：（仅限 TypeScript）指定状态的类型