用途:帮助 React/Next.js 项目选择并实现合适的状态管理方案,覆盖从局部状态到全局 store 的常见模式。
主要能力:给出状态管理分层建议——组件内用 useState;需通过 URL 分享的筛选/标签用 useSearchParams;数据库或 API 数据优先用 Server Component;简单全局状态(主题、用户、设置)用 Context;复杂全局状态用 Zustand。Zustand 部分包含基础 store、persist 持久化到 localStorage、slice 拆分、immer 不可变更新、异步 action、计算值与中间件组合(devtools/persist/immer)。表单推荐 React Hook Form 配合 zod 校验。性能方面讲解选择器订阅、shallow 比较、React.memo 与 useCallback。
使用方式:按资料中的决策树判断状态归属,再套用对应代码模式;Zustand 通过 create 创建 store,用选择器读取所需字段,需要持久化时引入 persist 与 createJSONStorage。
适用场景:选型决策、搭建 Zustand store、优化重渲染、管理表单状态、实现全局用户设置、排查状态问题、从 Redux 迁移到 Zustand、配置持久化状态。
限制:资料未提供安装命令、版本要求、性能基准或收费信息;示例基于 React/Next.js 与 TypeScript,其他框架需自行调整。