mapDispatchToProps和{action}有什么区别

Question

所以我一直想知道很长一段时间和之间的区别是什么

connect(mapStateToProps, mapDispatchToProps)(ComponentName)

和

connect(mapStateToProps, {action})(ComponentName)

我一直在使用第二个版本，但我不知道这是否是一个好的做法。任何反馈都是有用的，因为我真的想知道是否有任何差异，如果没有，为什么每个人都使用mapDispatchToProps()而不仅仅是导出{action}这样的动作?我猜如果你有很多动作你会使用mapDispatchToProps但如果你只有3-4个为什么不直接导出它们比如在connect中导出{action}呢?

Answer 1

你说的mapDispatchToProps是什么意思值得怀疑，因为这个参数可以是对象或函数。

如果它是关于将对象重写为变量，如:

const mapDispatchToProps = { action1, action2, action3 }
connect(mapStateToProps, mapDispatchToProps)(ComponentName)

vs:

connect(mapStateToProps, { action1, action2, action3 })(ComponentName)

这并不是的问题，好的实践，而是关于个人喜好和/或你的队友。

另一方面，mapDispatchToProps也可以是一个函数。你可以质疑哪个作为参数传递更好:函数还是对象。定义为函数的好处可以在文档中读到:

将mapDispatchToProps定义为函数，使您在自定义组件接收的函数时具有最大的灵活性，并且它们如何分派动作。

因此，如果你想自定义你的道具调度函数，你可以定义如下函数:

const mapDispatchToProps = (dispatch, ownProps) => {
return {
onClick: event => dispatch(myAction1(event.target.value)),
addItem: () => dispatch(myAction2(ownProps.itemId))
}
connect(mapStateToProps, mapDispatchToProps)(ComponentName)

上面是一个简单的例子，你有一个道具onClick，它已经处理了预期的event参数。该函数还使用ownProps，您可以在需要时使用它(如第二个prop函数)。

但是如果你不认为需要定制你的分派函数，那么你可以继续只传递一个对象，就像你已经做的那样。

Answer 2

这不是一个坏的做法。实际上，react-redux文档本身也推荐这样做。

因为这很常见，connect()支持mapDispatchToProps参数的"对象速记"形式:如果你传递一个充满动作创建者的对象而不是一个函数，connect将自动在内部为你调用bindActionCreators。

我们建议始终使用mapDispatchToProps的"对象简写"形式，除非您有特定的理由自定义调度行为。

你可以在文档的这一页找到所有相关信息

我希望这能消除你的疑虑。