当我更新我的redux商店时，React不会重新渲染

Question

我知道它是我......因为我很糟糕：）

但我相信我正在做的一切都是正确的，但是当我发送我的动作并且状态改变时，我的视图不会重新渲染。

我相信这是可能需要的简单改变，但

渲染（）

render(){
    ....
    <div className={data.participants}>
        +{store.getState().currentSex.participants}
    </div>
    ....
}

调用操作的功能

onSetParticipants = () => {
    console.info(store.getState()); //participants = 1
    store.dispatch (currentSex.setParticipants(3));
    console.info(store.getState()); //participants = 3
}

reducer currentSex.js

import { List, Map } from 'immutable';

const initialState = {
    participants: 1
};

function currentSex (state = initialState, action) {
    switch (action.type) {
        case 'SET_PARTICIPANTS':
            return {
                ...state,
                participants:action.participants
            }
    }
    return state
}

export default currentSex;

操作

export const SET_PARTICIPANTS = 'SET_PARTICIPANTS';

export function setParticipants(participants) {
    return {
        type: SET_PARTICIPANTS,
        participants: participants
    }
}

我如何完成连接，因为我认为这有助于

function mapStateToProps(state, ownProps) {
    return {
        errorMessage: state.errorMessage,
        inputValue: ownProps.location.pathname.substring(1)
    }
}

export default connect(mapStateToProps, { })(App)

请原谅我这不够或完全是错误的信息。

但是当我看到状态发生变化时，为什么我的页面没有重新渲染？

修改

值得一提的是我的州内有对象：

Answer 1

在mapStateToProps中，您需要添加要在组件内呈现的状态。在这种情况下，它看起来像state.participants。

function mapStateToProps(state, ownProps) {
    return {
        errorMessage: state.errorMessage,
        participants: state.participants,
        inputValue: ownProps.location.pathname.substring(1)
    }
}

然后在您的组件中使用this.props.participants。

import * as actions from '../actions';

/* ... */

render(){
    ....
    <div className={data.participants}>
        +{this.props.participants}
    </div>
    ....
}

/* ... */

export default connect(mapStateToProps, actions)(App)   

修改

并将操作添加到您的connect函数，以及导入它们。使用组件中处理更改事件的函数内的this.props.currentSex(3)调用您的操作。