react-redux - 连接的组件不会在状态更改时重新渲染

Question

我有一个组件，我通过 connect 传递了一个带有 mapStateToProps 参数的组件，以将一个道具 this.props.mainBuffer 从我的商店映射到我的状态树的一部分。当我更新状态的那部分时，只有组件没有呈现。 （我意识到 redux 的问题通常不是一成不变地改变状态，但我觉得我已经做到了）。

我的根（也是唯一的）reducer 看起来像：

function rootReducer(state = {}, action) {

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

而connect组件是这样连接的：

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

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

Answer 1

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