反应，状态改变但不重新渲染

Question

有一个我很困惑的情况。

我有一个对象redux状态：{显示：true，创意：{name：'a'，标签：[t1，t2，t3]}}。该对象已通过“ react-redux”的“连接”功能映射到道具。

当我更改属性“ show”或“ creative.name”时，它会触发重新渲染。但是，如果我将t0附加到“ creative.tags”，则不会重新渲染。

# reducer.js
# block code does not re-render ===========
state.creative.tags.push(t0)
return state
# end block code does not re-render =======

我必须通过分配新变量来解决。

# reducer.js
# block code does re-render ===========
let new_state = Object.assign({}, state);
new_state.creative.dsp_tags.push(action.payload);
return new_state
# end block code does re-render =======

能否让我知道reactJS如何识别变化的状态？

Answer 1

您不能直接更改状态，应该始终创建副本并返回新状态。 您直接插入标签的事实是导致问题的原因。

在返回状态对象之前创建一个新数组：

const newtags = [...state.creative.tags, action.payload];
let creative= Object.assign({}, state.creative, { tags: newtags } );
let new_state = Object.assign({}, state, { creative } );

Answer 2

根据定义，

Reducer必须由Pure Functions或集合组成。意思是state必须保留immutable的地方。您可以使用state之类的扩展操作来复制...state对象，然后进行必要的操作。