我有一个 Table 组件,它呈现项目列表的行:
return <Row style={styles.row} key={idx} item={item} onSelect={this.props.onRowSelect}>
{columns.map((col, idx) => {
return <Column style={col.style} key={`${item._id}_${col.key}`}
width={col.width || this._defaultCellWidth} type={col.type}>
{_.get(item, col.key)}
</Column>
})}
</Row>
每个项目都有 selected:bool
值,该值绑定(bind)到每行上的复选框。
另外,我有一个 HeaderRow,其中有用于全选的复选框。 通过选中该复选框,我调度一个事件来更新所选字段。 状态本身已更新,但没有重新渲染。 我的行动是:
if(action.id)
{
let index = state.items.findIndex(item => item._id == action.id);
state.items[index].selected = action.selected;
}
else
{
state.items.map(e=>e.selected = action.selected);
}
return
{
...state,
items: state.items
}
编辑: 这是一个好的解决方案吗:
if(action.id) {
let index = state.items.findIndex(item => item._id == action.id);
state.items[index].selected = action.selected;
return {
...state
}
}else{
return {
...state,
items: state.items.map((item, index) => {
return Object.assign({}, item, {
selected: action.selected
})
})
}
}
最佳答案
请记住all data in the Redux store must be considered immutable ("[a reducer] must never mutate its arguments")。
您正在改变 state.items
中的项目,并且由于 items
仍然是同一对象,Redux 认为它没有变化,因此 View 不会更新。
关于javascript - React Redux 元素未更新,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43066585/