在mapDispatchToProps中绑定操作参数

Question

我有一个提交按钮,将发送一个动作.操作的有效负载是将发送到API的发布数据.目前我使用bindActionCreators的mapDispatchToProps:

const mapDispatchToProps = (dispatch) => ({
    actions:  bindActionCreators(FormActions, dispatch)
});

然后在我的组件中,我绑定onClick到提交操作:

<input type="submit" onClick={() => this.props.actions.submit(this.props.postData)} />

我不喜欢我必须给这个组件提供帖子数据mapStateToProps.我更愿意给组件一个已经将post数据绑定到submit函数的动作,所以它的用法如下所示:

<input type="submit" onClick={this.props.submit} />

这可能吗？我无法访问该州mapDispatchToProps

Answer 1

有一个叫第三个参数mergeProps的connect方法react-redux这是应该像一个你刚才所描述的情况下使用.在您的情况下,您可以执行以下操作:

const mapStateToProps = state => ({ postData: ... });

const mapDispatchToProps = (dispatch) => ({
  actions:  bindActionCreators(FormActions, dispatch)
});

const mergeProps = (stateProps, dispatchProps) => ({
  submit: () => dispatchProps.actions.submit(stateProps.postData),
});

const ConnectedComponent = connect(mapStateToProps, mapDispatchToProps, mergeProps)(Component);

需要注意的是组件将不会收到actions,也没有postData,只是submit.