Redux要求始终从还原器返回新状态。例如,我具有以下状态:
let initialState = {
prop: 3,
internalReferenceProp: {a:3}
}
以及修改
internalReferenceProp
的减速器。该reducer可以实现为仅更改state
对象引用或同时更改state
和internalProperty
:function(state=initialState, action) {
// changing only state reference
let newState = Object.assign({}, state);
newState.internalReferenceProp.a = 7;
return newState;
// changing both state and internalReferenceProp reference
return Object.assign({}, state, {internalReferenceProp: {a:7}})
}
有人告诉我第一种方法不正确,所以我的问题是要求也更改内部引用的背后原因是什么?我知道我应该更改
state
引用,因为它可以轻松比较以检测state
是否已更改,但是为什么要更改内部引用? 最佳答案
第一个显然是不正确的,因为Object.assign
做的是浅拷贝,而不是深拷贝。
// changing only state reference
let newState = Object.assign({}, state);
newState === state // false
newState.internalReferenceProp === state.internalReferenceProp // true
state.internalReferenceProp.a // 3
newState.internalReferenceProp.a = 7 // 7
state.internalReferenceProp.a // 7
您可以看到,如果我们更改
newState
中的某些内容,它也会在state
中更改。如果某个组件仅对internalReferenceProp
感兴趣,这将使更改无法检测。这也称为“副作用”,是一种不良做法。简而言之,如果您的输入(在这种情况下为
state
)发生任何变化,则称为副作用,并且在redux中是错误的。这是一个为什么不好的示例:
let data = getData(); // from redux
return (
<ChildComponent someProp={data.internalReferenceProp} />
);
如果我们使用带有副作用的版本,
ChildComponent
将永远不会重新渲染,因为它的道具没有改变。 oldData.internalReferenceProp === newData.internalReferenceProp
。关于javascript - 为什么要求总是返回带有新内部引用的新对象,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/34516894/