【问题标题】:React/Redux Component not re-renderingReact/Redux 组件不重新渲染
【发布时间】:2017-09-26 21:58:28
【问题描述】:

即使我看到状态已正确更新,我也遇到了反应组件未重新渲染的问题。我正在使用 redux,我读过状态突变通常是问题/原因,我只是不认为我在这样做。我正在更新的值嵌套在状态深处的 3 层。

代码如下:

import { RECEIVE_CURRENT_SCAN_RESULT } from '../constants';

const initialState = {
    currentScanResult: {info:{}, results:[]},
};

[RECEIVE_CURRENT_SCAN_RESULT]: (state, payload) =>
    Object.assign({}, state, {
      currentScanResult: Object.assign(state.currentScanResult, payload)
    }),

export function createReducer(initialState, reducerMap) {
    return (state = initialState, action) => {
        const reducer = reducerMap[action.type];

        return reducer
            ? reducer(state, action.payload)
            : state;
    }
}

【问题讨论】:

  • 发布了一个带有建议独奏的答案,并建议对您的问题进行非常小的编辑(Stackoverflow 需要问题上的“javascript”标签,否则语法高亮不起作用,即为什么您的代码以及已发布答案中的任何代码看起来都像没有颜色的灰色文本。)。
  • 附言。我只是在我的回答中添加了一个说明。

标签: javascript reactjs redux react-redux state


【解决方案1】:

Object.assign中的第一个参数是“目标”对象,

所以这一行

currentScanResult: Object.assign(state.currentScanResult, payload)

仍在改变状态的currentScanResult 属性。

Object.assign 中使用一个空对象作为第一个参数,就像你在第一级所做的那样,所以整个事情变成了:

// empty object as target here
Object.assign({}, state, {
  // empty object as target here as well
  currentScanResult: Object.assign({}, state.currentScanResult, payload)
})

这至少应该测试问题是突变问题还是其他需要修复的问题。

【讨论】:

  • 很高兴听到它有效!你不烂!学习有时很难(如果它容易,那么 Stackoverflow 就不会存在),即使你学得很好,也很容易犯这样的小错误。
猜你喜欢
  • 2018-03-24
  • 1970-01-01
  • 2023-03-28
  • 1970-01-01
  • 2017-06-17
  • 1970-01-01
  • 2017-02-10
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多