如何调用具有稍微更新的 prop 值的 reducer？

Question

我有一个按钮下拉菜单，它在单击时触发处理程序。此人的年龄是 21 岁，但他们在下拉菜单中单击了一个选项，将自己设置为 30 岁。

handleChange = (newAge: number) => {
  let updatedPerson = this.props.person
  updatedPerson.age = newAge
  this.props.updatePerson(updatedPerson);
};

this.props.updatePerson(updatedPerson) 很好 - 但在我的调试器中我可以看到设置 updatedPerson.age = newAge 实际上并没有更新值 age。我必须把它放在减速机里吗？我可以在将 updatedPerson 发送到 reducer 之前更改它的值吗？

Answer 1

props 在 React 中是不可变的——你不能修改它们。 updatedPerson 变量仍然持有对 props 对象的引用。

行内：

updatedPerson.age = newAge;

突变发生了。但因为这是不可能的 - 什么都没有改变。

如果你想让它工作，你可以，例如复制 person 个对象。

let updatedPerson = { ...this.props.person };

如何调用具有稍微更新的 prop 值的 reducer？

How do I call a reducer with a slightly-updated prop value?

reactjs

redux

react-props