zustand修改一个object对象的嵌套属性，会触发更新吗

曹天骄2024-06-02 15:29

在 Zustand 状态管理库中，当使用 set 方法来更新一个对象的嵌套属性时，并不会触发整个对象的更新操作。相反，Zustand 使用了浅比较来检测状态的变化，只有当状态内部的引用发生变化时，才会触发更新操作。

因此，如果只是更新一个对象的嵌套属性，而对象本身的引用保持不变，那么并不会触发状态更新。这意味着，需要确保在更新对象嵌套属性时，生成一个新的对象，而不是直接修改原始对象。

以下是一个示例，展示了在使用 Zustand 中更新对象嵌套属性时应该如何操作：

javascript 复制代码

import create from 'zustand';

const useStore = create((set) => ({
  user: {
    name: 'Alice',
    age: 30,
  },
}));

// 正确方式：创建一个新的 user 对象来更新嵌套属性
const updateUserAge = (newAge) => {
  useStore.setState((state) => ({
    user: {
      ...state.user,
      age: newAge,
    },
  }));
};

// 错误方式：直接修改原始对象，不会触发状态更新
const updateAgeDirectly = (newAge) => {
  useStore.setState((state) => {
    state.user.age = newAge; // 这样并不会触发状态更新
    return state;
  });
};

所以，为了确保状态更新可以被触发，建议在更新对象嵌套属性时始终采用以上示例中的"正确方式"：创建一个新的对象，并确保每次更新都返回一个新的状态对象。这样可以确保状态的变化被正确地检测到并触发更新操作。