reactjs - React-Redux - 连接的组件不会在状态更改时重新渲染

标签 reactjs redux

我有一个组件,我已通过 connect 使用 mapStateToProps 参数将一个 prop this.props.mainBuffer 映射到我商店里的州树的一部分。当我更新状态的那部分时,只有组件没有呈现。 (我意识到 redux 的问题通常不是一成不变地改变状态,但我觉得我已经做到了)。

我的根(也是唯一的) reducer 如下所示:

function rootReducer(state = {}, action) {

    switch (action.type) {
        case NEW_BUFFER:
            return Object.assign({}, {mainBuffer: action.samples})
        default:
            return state;
    }
}

连接组件是这样连接的:

export default connect((state) => ({
    mainBuffer: state.mainBuffer
}))(WaveformVisualizer);

我已经使用react-redux几个星期了,这一直有效。通常,如果我指定状态树的一部分 state.MainBuffer 并确保在 reducer 中对其进行不可更改的更新,则组件将触发渲染。但它不再发生了,我不明白为什么。

最佳答案

我相信我们设法在 Reactiflux 聊天 channel 中解决了这个问题。列出的示例代码不太准确 - 真正的代码正在执行 Object.assign(state, {mainBuffer : action.samples}),这会改变现有状态。解决方案实际上是传递一个新的空对象作为第一个参数,例如 Object.assign({}, state, {mainBuffer : action.samples})。等效的对象传播用法将是 return {...state, mainBuffer : action.samples}

关于reactjs - React-Redux - 连接的组件不会在状态更改时重新渲染,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46439312/

相关文章:

reactjs - 使用 useState 和 enzyme 查询组件的内部状态

ios - Redux:最佳实践(使用 Swift)

Redux Saga socket.io

javascript - 如何计算点击可拖动 Canvas 元素的位置?

javascript - 将 API 响应数据从 Redux 状态传递到组件 props

css - 在已经使用 withTheme() 的情况下使用 withStyles() 覆盖 material-ui 主题

javascript - ESLint 希望 setSate 作为 useEffect 的依赖项,但这会导致无限循环(react-hooks/exhaustive-deps)

javascript - ReactJS - 在 Prop 中使用嵌套数组渲染 Map 函数

javascript - 尝试上传到 aws s3 存储桶时收到 400 Bad Request

angular - Redux/ngrx/store 架构 : why not dispatch actions from dumb components?