Question

我有以下减速器：

export default function UserReducer(state = initialState, action){
let nextState;
switch(action.type){
    case USER_RECOVERY_CODE_VALIDATED:
    nextState = {
        ...state,
        recoverycodevalidated : action.payload.recoverycodevalidated
    }
    return nextState;
default:
     return state;
 }
}

我的组件以这种方式连接到商店：

function mapStateToProps(state) {
    console.log("updated");
    return { recoverycodevalidated: state.user.recoverycodevalidated };
 }

export default connect(mapStateToProps)(ResetPasswordCodeScreen)

当使用 mapStateToProps 功能更改道具时，我将用户重定向到下一个屏幕：

 async componentWillReceiveProps(newProps){
    console.log("updated props");
    if(newProps.recoverycodevalidated){
        this.props.navigation.navigate("ResetPasswordFinal", { userId: this.props.navigation.state.params.userId});
    }
}

问题在于，当第一次更新状态并且在道具中设置了 recoverycodevalidated 的值时，如果变量的值为同样，道具不会更新，因为即使每次都触发 mapStateToProps ，也不会触发方法 componentWillRecieveProps 。我做错了什么？

Answer 1

尝试改用 componentDidUpdate

componentDidUpdate(prevProps) { 
     console.log("updated props");
     if (prevProps.recoverycodevalidated) {
        this.props.navigation.navigate("ResetPasswordFinal", { userId: 
        this.props.navigation.state.params.userId});
     }
}

当state具有相同值时，调用mapStateToProps但不调用componentWillRecieveProps

1 个答案: