5月29日 22:40

React Native 中如何使用 Zustand 管理状态?

和 Web 端完全一样——npm install zustand,create((set) => ({ ... })) 创建 store,组件里 useStore(selector) 读取。Zustand 不依赖 DOM API,纯 JS 实现,React Native 直接能用。唯一需要注意的是持久化:Web 用 localStorage,RN 用 mmkv 或 AsyncStorage,配合 zustand/middleware 的 persist 中间件传入不同的 storage adapter。

追问

Zustand 和 Redux 在 RN 中哪个更合适?

Zustand。RN 对包体积敏感,Zustand 1KB vs Redux+RTK 约 30KB。API 更简洁,不需要 Provider 包裹根组件。新项目优先 Zustand。

如何做持久化存储?

用 MMKV 而非 AsyncStorage——MMKV 同步读写,快 30 倍。persist 中间件传入 createJSONStorage(() => mmkvStorage) 即可。关键字段(token、用户偏好)必须持久化。

多个页面共享状态会重复渲染吗?

用 selector 精确订阅就不会。useStore(s => s.token) 只在 token 变化时重渲染。切忌 useStore() 全量订阅。

后台被系统杀掉 store 会丢吗?

没做持久化的会丢。RN 端内存回收后 JS 上下文重建,store 恢复初始值。关键字段必须 persist。

导航中需要传递 store 吗?

不需要。Zustand 是全局单例,任何组件直接 useStore 即可,不用像 Context 那样逐层传递。

标签:Zustand