createStore

相关源文件

• docs/apis/create-store.md
• docs/apis/shallow.md
• docs/hooks/use-shallow.md
• docs/middlewares/immer.md
• docs/middlewares/persist.md
• src/vanilla.ts
• tests/basic.test.tsx

createStore 是 Zustand 中的一个核心函数，它能够创建纯粹的（不依赖框架的）状态容器。与特定于 React 的 create 函数不同，createStore 提供了一个纯粹的状态管理解决方案，可以用于任何 JavaScript 应用程序，而无需考虑框架。

如果您正在寻找特定于 React 的 store 创建方式，请参阅 create。

概述

createStore 函数允许您创建一个状态容器，该容器公开了一个简单的状态管理 API。它构成了 Zustand 架构的基础，提供了库其他部分所依赖的核心状态管理能力。

来源: src/vanilla.ts43-51 src/vanilla.ts99-100

函数签名

createStore 接受一个状态创建函数，并返回一个 store API 对象

来源: src/vanilla.ts29-37 src/vanilla.ts43-51 src/vanilla.ts60-97

参数

• stateCreatorFn：一个接受以下参数的函数
  • set：一个用于更新状态的函数
  • get：一个用于检索当前状态的函数
  • api：Store API 对象（允许自引用）

状态创建函数应返回一个表示初始状态的对象。

返回值

createStore 返回一个 Store API 对象（StoreApi<T>），其中包含以下方法：

• setState：部分或全部更新状态
• getState：返回当前状态
• getInitialState：返回初始状态
• subscribe：注册一个监听器，当状态改变时会调用该监听器

来源: src/vanilla.ts9-14 src/vanilla.ts60-97

核心实现

createStore 的核心实现负责管理状态和监听器

来源: src/vanilla.ts60-97

基本使用示例

这是一个 `createStore` 的基本用法示例

来源: docs/apis/create-store.md48-107

状态更新

createStore 提供了几种更新状态的方式

更新原始类型

对于原始类型的值，通常需要替换整个状态

来源: docs/apis/create-store.md127-148

更新对象

对于对象，您可以执行部分更新，这些更新将与现有状态合并

当您想完全替换状态对象时，请使用 replace 参数

来源: docs/apis/create-store.md165-222

基于先前状态的更新

当更新依赖于先前状态时，请使用 `setState` 的函数形式

来源: docs/apis/create-store.md49-107

状态订阅

subscribe 方法允许您注册监听器，当状态发生变化时会调用它们

订阅状态变化的示例

来源: src/vanilla.ts88-92 docs/apis/create-store.md277-324

与中间件集成

createStore 可以通过中间件进行增强，以获得额外功能

使用 Immer 中间件的示例

来源: docs/middlewares/immer.md174-189

使用 Persist 中间件的示例

来源: docs/middlewares/persist.md96-107

与 React 的 `create` 的比较

关键区别

1. 目标用途:

   • createStore 是不依赖框架的，并返回一个纯粹的 store API
   • create 是特定于 React 的，并返回一个 hook 函数

2. 访问模式:

   • 使用 `createStore`：store.getState().count
   • 使用 `create`：useStore(state => state.count)

3. 订阅处理:

   • 使用 `createStore`：通过 `subscribe()` 手动订阅
   • 使用 `create`：当选定的状态改变时自动重新渲染

来源: src/vanilla.ts99-100

常见模式和最佳实践

组织状态和操作

通常将状态分为两部分

• 状态值（数据）
• 操作（更新状态的方法）

TypeScript 类型安全

常见陷阱与解决方案

直接修改状态

一个常见的错误是直接修改状态而不是创建新对象

来源: docs/apis/create-store.md342-517

未取消订阅 Store

当订阅状态变化时，请确保在不再需要订阅时取消订阅

结论

createStore 是 Zustand 状态管理系统的基础，为任何 JavaScript 应用程序提供了最小化但功能强大的状态管理 API。它可以直接用于纯 JavaScript 应用程序，或作为 Zustand 的 React 集成等特定于框架的绑定的基础。

通过理解和利用 `createStore`，您可以构建灵活、高效的状态管理解决方案，这些解决方案可以在不同的上下文和框架中工作。