createStore
编辑此页面Store 被有意设计用来管理对象和数组等数据结构,但也能够处理字符串和数字等其他数据类型。
类型签名
import { createStore } from "solid-js/store"import type { StoreNode, Store, SetStoreFunction } from "solid-js/store"
function createStore<T extends StoreNode>( state: T | Store<T>): [get: Store<T>, set: SetStoreFunction<T>];
type Store<T> = T; // 概念上是只读的,但没有用类型表示
使用方法
import { createStore } from "solid-js/store";
// 初始化 storeconst [store, setStore] = createStore({ userCount: 3, users: [ { id: 0, username: "felix909", location: "England", loggedIn: false, }, { id: 1, username: "tracy634", location: "Canada", loggedIn: true, }, { id: 1, username: "johny123", location: "India", loggedIn: true, }, ],});
Getter(获取器)
Store 对象支持使用 getter 来存储派生值。
const [state, setState] = createStore({ user: { firstName: "John", lastName: "Smith", get fullName() { return `${this.firstName} ${this.lastName}`; }, },});
Setter(设置器)
更改可以是传递前一个状态并返回新状态的函数,也可以是一个值。
对象总是进行浅合并。将值设置为 undefined 可以从 Store 中删除它们。
在 TypeScript 中,你可以通过使用非空断言来删除值,比如 undefined!
。
const [state, setState] = createStore({ firstName: "John", lastName: "Miller",});
setState({ firstName: "Johnny", middleName: "Lee" });// ({ firstName: 'Johnny', middleName: 'Lee', lastName: 'Miller' })
setState((state) => ({ preferredName: state.firstName, lastName: "Milner" }));// ({ firstName: 'Johnny', preferredName: 'Johnny', middleName: 'Lee', lastName: 'Milner' })
要了解更多关于使用 store 的信息,请查看 Stores 指南,以及 Store 工具 部分以获取更高级的 API。