Question

我有一个“读者”（对象）数组，每个读者都有一个布尔类型的 .ToString() 属性。我创建了一个重置按钮，为每个读者设置 [pscustomobject]。这是我的减速器：

done

按钮只是发送动作：

reader.done = false

虽然读者由一个列表组件表示，该组件只是将所有读者映射到此 export const ReadersReducer = (state, action) => { switch (action.type) { case "RESET_DONE": return state.map((reader) => { reader.done = false; return reader; }); default: return state; } };：

<button onClick={() => dispatch({type: "RESET_DONE"})}>reset</button>

当我单击重置按钮时，它实际上执行了它应该执行的操作（因为它使用上下文提供程序组件中的 useEffect 更新后端），但复选框保持选中状态。为什么？

Answer 1

问题是您的减速器返回相同的 reader 对象，因此传递到组件中的 reader 道具似乎（对 React 而言）没有改变。您可以按如下方式解决此问题：

export const ReadersReducer = (state, action) => {
  switch (action.type) {
    case "RESET_DONE":
      return state.map((reader) => {
        return {...reader, done: false};
      });
    default:
      return state;
  }
};

即使我没有改变状态，useReducer 操作也不会在状态更改后重新呈现

1 个答案: