reactjs - this.props 在组件 ReactJS 的第一次调度操作后变得未定义

Question

我在我的反应组件中使用第三方组件，并且我正在使用 redux 流进行状态管理。

客户组件

class Customer extends React.Component {
  constructor(props) {
    super(props); //This works fine and props are correct
  }
  render() {
    return (
      <>
        <div>Hello</div>
        <ThirdPartyComponent
           eventHandlers={
            new Map([
              [
                "loaded",
                function () {
                 //This is the second action call but this.props becomes undefined at this stage after
                 //the first action of getCustomerObject is called. Not sure why? This is the problem 
                 this.props.actions.handleExtraFunctionality();
                },
              ],
          getCustomer={(customerObject) => {
           //This is the first action call and it works which updates the state
            this.props.actions.getCustomerObject(customerObject);
          }}
        />
      </>
    );
  }

function mapStateToProps(state) {
  return state;
}

function mapDispatchToProps(dispatch) {
  return {
    actions: {
      handleExtraFunctionality: bindActionCreators(
        customerActions.handleExtraFunctionality,
        dispatch
      ),
      getCustomerObject: bindActionCreators(
        customerActions.getCustomerObject,
        dispatch
      ),
    },
  };
}

export default connect(mapStateToProps, mapDispatchToProps)(Customer);

行动

function getCustomer(customer) {
  return { type: types.GET_CUSTOMER, customer};
}

我试图在第一个动作之后调用第二个动作，但是 this.props 在第一个调用完成后变得未定义。我不确定为什么？有人可以帮忙吗？

标签： reactjsreduxreact-reduxredux-thunk