Question

假设我有这种状态：

state: {
  field1: value1,
  field2: {a: 5, b: 7}
}

如果reducer想要仅更新field1 ，则reducer可以返回包含新field1的新对象和现有对象state.field2 {{ 1}}新返回状态的属性？或者缩减器是否必须克隆field2？

Answer 1

使用传播运营商

return {
 ...state, 
 field1: newVal
}

这是链接详细的不可变更新模式

http://redux.js.org/docs/recipes/reducers/ImmutableUpdatePatterns.html

Answer 2

是。回收状态不仅是允许的，而且推荐。

说你的初始状态是：

{
  object1: { /* key-pair values */ },
  object2: { /* key-pair values */ },
}

如果你像这样更新你的州：

// bad
return {
  object1: action.object1,
  object2: Object.assign({}, state.object2),
}

然后您的应用认为object2已更改，即使它没有。这可能会导致React组件中出现不必要的计算和重新渲染。

最好只更新状态中实际发生变化的部分。

// good
return Object.assign({}, state, {
  object1: action.object1,
});

Answer 3

Object.assign()正是你要找的，现在你也可以使用扩展运算符（...），但要注意那些是ES6的功能，所以像Internet Explorer（甚至11）这样的东西会崩溃这两个，所以你需要一个polyfill，检查这个链接它会给你更多关于它的信息，也为旧版浏览器提供polyfill https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object/assign

var o1 = { a: 1 };
var o2 = { b: 2 };
var o3 = { b: 3 , c:2 };

var obj = Object.assign(o1, o2, o3);

console.log(obj); // { a: 1, b: 3 , c: 2 }

希望有所帮助

redux reducer能否将旧状态的属性作为新状态的一部分返回？

3 个答案: