Redux ComponentDidMount 未触发

Question

我无法让组件在操作后重新渲染。我知道我必须在减速器中返回一个新对象，所以我返回一个全新的状态，但它仍然没有触发 componentDidMount() 或 render()

我的组件：

class AppTemplate extends React.Component {

    constructor(props) {
        super(props);

        if(!this.props.settings.user){
            this.props.dispatch(userActions.get());
        }
    }

    componentDidUpdate(prevProps, prevState) {

        console.log(prevProps, this.props);

        //do some stuff

    }


    render() {

        return (
            <SomeComponent/>
        );
    }
}

function mapStateToProps(state) {
    const { registration, role, settings } = state;
    console.log(role);
    return {
        registration,
        role,
        settings
    };
}

const connectedAppTemplate = connect(mapStateToProps)(AppTemplate);
export { connectedAppTemplate as AppTemplate }; 

我的减速机：

export function role(state = { role : null, loading: true }, action) {

  switch (action.type) {
    case 'USER_GET_PENDING':
      return {
        role:null,
        loading: true
      }
    case 'USER_GET_FULFILLED':
      const role = action.payload.data.roles[0];
      const newState = {
        role: role,
        loading: false
      }
      console.log(state, newState);
      console.log(state == newState);
      return newState;
    default:
      return state
  }

}

该操作正在顺利完成，甚至 mapToState 也在使用新角色进行记录，但 componentDidMount 从未触发。有什么想法吗？

谢谢！

Answer 1

componentDidMount 仅调用一次。这是组件第一次完成加载的时间。如果您正在更新 redux 存储，那么您将收到对 componentWillReceiveProps 的调用，如果您在那里触发渲染，您将看到 componentDidUpdate 将触发。

编辑：虽然当通过 redux 接收到新的 props 时组件将再次渲染...componentDidMount 仍然只会被调用一次。你最好使用componentWillReceiveProps 和componentDidUpdate 来完成你想要完成的事情。

感谢下面 cmets 中的 Dan O（押韵）指出了我的错误。