useState
useState 可组合函数创建了一个响应式且服务器端渲染友好的共享状态。
使用
// Create a reactive state and set default value
const count = useState('counter', () => Math.round(Math.random() * 100))
由于
useState
内部的 数据将被序列化为 JSON,因此请确保它不包含任何无法序列化的内容,例如类、函数或符号。useState
是编译器转换的保留函数名,因此您不应将自己的函数命名为 useState
。使用 shallowRef
如果您不需要您的状态深度响应式,您可以将 useState
与 shallowRef
结合使用。当您的状态包含大型对象和数组时,这可以提高性能。
const state = useState('my-shallow-state', () => shallowRef({ deep: 'not reactive' }))
// isShallow(state) === true
类型
useState<T>(init?: () => T | Ref<T>): Ref<T>
useState<T>(key: string, init?: () => T | Ref<T>): Ref<T>
key
:一个唯一键,确保跨请求正确去重数据获取。如果您不提供键,则会为您生成一个对useState
的文件和行号唯一的键。init
:一个函数,在未初始化时为状态提供初始值。此函数还可以返回一个Ref
。T
:(仅限 TypeScript) 指定状态的类型