不可变状态和合并

就像 React 的 useState 一样，我们需要以不可变的方式更新状态。

这是一个典型的例子：

import {create} from 'zustand'

const useCountStore = create ((set) => ({
  count: 0,
  inc: () => set((state) => ({ count: state.count + 1 })),
}))

set 函数用于在存储中更新状态。因为状态是不可变的，所以它应该是这样的：

set((state) => ({ ...state, count: state.count + 1 }))

然而，因为这是一个常见的模式，set 实际上会合并状态，我们可以跳过…state 部分：

set((state) => ({ count: state.count + 1 }))

嵌套对象

set 函数只在一个层级合并状态。如果你有一个嵌套的对象，你需要显式地合并它们。你会像这样使用扩展运算符模式：

import { create } from 'zustand'

const useCountStore = create ((set) => ({
  nested: { count: 0 },
  inc: () =>
    set((state) => ({
      nested: { ...state.nested, count: state.nested.count + 1 },
    })),
}))

对于复杂的使用情况，考虑使用一些帮助进行不可变更新的库。你可以参考更新嵌套状态对象值。

替换标志

要禁用合并行为，你可以为 set 指定一个替换布尔值，如下所示：

set((state) => newState, true)