Reactjs mapDispatchToProps在Redux土地上的用途

映射DispatchToprops是否有目的：

const mapDispatchToProps = dispatch => {
  return {
    addProductToCart: product => dispatch(addProductToCart(product))
  }
}

或者仅仅这样做是可以接受的：

const mapDispatchToProps = dispatch => {
  return {dispatch};
}

然后打电话：

---

组件中的

props.dispatch（）

mapDispatchToProps

允许您简单地指定组件需要分派的操作。您可以采用这种方法，因为它更具声明性（让

mapDispatchToProps

处理所有繁重的工作，以便您可以轻松地从组件调用函数），或者您希望与未连接的redux组件共享调度函数

事实上，完全可以不使用

mapDispatchToProps

功能

另外，基于您的示例。而不是执行以下操作：

const mapDispatchToProps = dispatch => {
  return {dispatch};
}

您可以简单地从

connect

方法中排除

mapDispatchToProps

函数，如下所示：

connect(mapStateToProps)(MyComponent)

然后在组件中执行以下操作：

props.dispatch({ type: 'MY_ACTION' })}

---

没有

mapDispatchToProps

：-

this.props.dispatch(showAlert(message));

this.props.onShowAlert(message);

使用

mapDispatchToProps

：-

this.props.dispatch(showAlert(message));

this.props.onShowAlert(message);

---

这是

mapDispatchToProps

的主要原因，我想应该是

这个.props.onShowAlert

bro，对吧？你可能误解了这个问题。他们在问为什么有人会选择一种方法来处理另一种方法。此外，这会分离关注点。您的组件不应该真正了解您的操作。通过传递

dispatch

函数，您将组件耦合到Redux。将它们映射到prop函数有助于形成一种内聚结构，这种结构不会将实现细节（如使用Redux）泄漏到组件中

this.props.addProductToCart

如果您选择从Redux迁移，则将来可以将其改编为另一个库。这使得重构变得更加简单。使用TypeScript，手动包含

const-mapDispatchToProps=dispatch=>{return{dispatch}；}

然后使用

ReturnType

会更容易。我认为让易用性决定代码结构是一种不好的做法。优先考虑更好的设计模式。注意，要推断

connect

传递到组件的道具类型。如果你和我一样懒惰，可以使用hook