Redux：渲染時道具未定義

Question

嘗試用自己的示例實現ReactRedux時，我有點掙扎。 看起來好像我的道具沒有任何值，當React渲染它們時仍然沒有定義。 我的方法總體上是正確的，只是一個簡單的錯誤，還是真的有問題？

我在jsbin中重新創建了我的問題：

class Walls extends React.Component {
    render() {
    return (
        <div id="main">
            <div>volume: {this.props.volume}m³</div>
        </div>
    )}
}

const mapStateToProps = (state) => {
    return {
        volume: state.volume
    };
}

const WallContainer = connect(mapStateToProps)(Walls);

function reducer(state = Map(), action) {
  switch (action.type) {
  case 'SET_STATE':
    return state.merge(action.state);
  }
  return state;
} 

const store = createStore(reducer)
store.dispatch({
    type: 'SET_STATE',
    state: {"volume":1567.571734691151}
})

ReactDOM.render(
        <Provider store={store}>
            <WallContainer />
        </Provider>, 
        document.getElementById('root')
);

Answer 1

您只需在連接時從不可變Map映射回來，否則您的方法對我來說似乎是正確的：

const mapStateToProps = (state) => {
    return {
        volume: state.get('volume')
    };
}

請記住，此時， state仍然是Immutable Map ，而不僅僅是JavaScript對象。