reactjs - this.props.dispatch() 使用重构生命周期 ({}) 未定义

Question

所以我试图将我的生命周期方法移动到使用 Recompose 的 HOC 装饰器中。像这样的东西...

export const fetchOptions= lifecycle({  
  componentDidMount() {
     this.props.dispatch(change('mainForm', 'orderHeader.proxies', this.props.currentSalesRepId));
  },

  componentDidUpdate(prevProps) {
    if (this.props.total != prevProps.total){
      this.props.dispatch(change('mainForm', 'totalPurchase', this.props.total));
    }
  }
 });

然后我试图将它添加到呈现我所有标记的表单组件中。像这样。

export default compose(
  connect(mapState, mapDispatch),
  fetchOptions,
)(MainReduxForm)

我不断收到 this.props.dispatch 不是函数的错误...有什么想法吗？我故意保持这个简短以避免文字墙。如果您需要更多信息，请告诉我！

Answer 1

这里的问题是，如果您不提供函数或在您的情况下，该dispatch方法只会自动添加到您的道具中。mapDispatchToPropsmapDispatch

所以你有两个选择，mapDispatch从你的连接呼叫中删除。

export default compose(
  connect(mapState),
  fetchOptions,
)(MainReduxForm)

或者，如果您在内部做某事，mapDispatch只需将调度添加到您的返回对象

const mapDispatchToProps = (dispatch) => {
    return {
        dispatch,
        ...
        other dispatch functions here
        ...
        }
    }
}