zustand-state-builder 介绍如何用 Zustand 的最小 API 实现轻量、可扩展的状态管理,主要面向需要在 React 应用中管理全局状态的开发者。
用途与主要能力:确定需要全局管理的状态、定义 state 与 actions、补充 TypeScript 类型、启用中间件(devtools、persist、immer)、按 slices 拆分大型 store,并通过 hooks 在组件中访问状态。文档还覆盖异步 action 及其错误处理、乐观更新与回滚。
使用方式:先执行 npm install zustand 安装;如需不可变更新辅助,可执行 npm install immer。基础 store 使用 create 定义状态与动作,在组件中调用对应 hook 获取状态。可组合 devtools 与 persist 中间件,persist 支持 createJSONStorage 和 partialize 指定需持久化的字段。使用 selectors 与 shallow 比较减少不必要渲染;也可在 React 组件外通过 getState、setState、subscribe 访问与订阅。大型应用采用 slices 模式,各 slice 用 StateCreator 定义后合并。服务端状态建议交给 TanStack Query,store 只保留客户端状态。测试使用 renderHook 与 act,并在每个用例前重置 store。
适用场景:React 应用的全局客户端状态、购物车、用户会话、UI 开关、设置持久化等。
限制与注意事项:资料未提供收费、价格、平台或效果信息;具体版本兼容性、包体大小与性能数据暂未提供。文档中的代码为示例。