已设置InitialState,但未执行reducer。减少不更改商店

时间:2019-12-01 13:48:01

标签: typescript redux react-redux action reducers

我正在尝试将redux与我的react native + Typescript应用集成。

我正在从特定组件中分派动作:

export const setCurrentOrder = (order: PostOrderRequest) => async (dispatch: Dispatch) => {
    console.log('order in action: ', order);
    dispatch({
            type: MENU_POST_ORDER,
            order: order
    });
}

该console.log未被执行,所以调用操作是否出错?

这是我从组件中调用setCurrentOrder的方式:

handleNext() {
        const {pizza} = this.state;
        const {navigation} = this.props;
        const currentOrder = {
            pizza
        }
        console.log('current order: ', currentOrder);
        setCurrentOrder(currentOrder);
        navigation.navigate('Login');
    }
在按钮的onPress事件上调用

handleNext()。

然后是我的减速器:

const initialState: MenuState = {
    order: {pizza: []}
}

export default function (state = initialState, action: MenuAction) {
    console.log('REDUCER: ', action);
    switch (action.type) {
        case MENU_POST_ORDER:
            return {
                ...state, 
                order: action.order
            };
        default:
            return state;
    }   
}

顺便说一下,reducer函数内部的console.log没有被执行!我不知道为什么,但是好像在设置initialState,但是reducer函数从不执行。

我从组件执行了setCurrentOrder。然后,执行此操作后,该组件会将用户路由到其他组件。从其他组件中,我正在使用react-redux来获取状态:

export default withNavigation(connect(
    state => ({
        state: state
    }),
    null
)(LoginScreen));

但是当我登录this.props.state时,它显示了initialState。我尝试将this.props.state设置为组件反应状态,并使用componentDidUpdate来检查道具是否发生变化,以及是否更改了我的反应状态。但它总是显示我的initialState:

为什么要设置initialState但未执行reducer函数?

编辑:

这是我从组件中分派setCurrentOrder的方式(withNavigation包装器是因为我正在使用react-native-navigation):

export default withNavigation(connect(
    null,
    (dispatch: Dispatch) => ({
        setCurrentOrder: (order: PostOrderRequest) => dispatch<any>(setCurrentOrder(order))
    })
)(MenuScreen));

1 个答案:

答案 0 :(得分:0)

嗯,真可惜。内部handleNext()

setCurrentOrder(currentOrder) 

应该是

this.props.setCurrentOrder(currentOrder)