mapDispatchToProps

Learn how to provide the action creators as props to your component which can then be dispatched.

Dispatching actions via mapDispatchToProps

Let’s look at the second parameter for the connect() function, mapDispatchToProps:

const mapDispatchToProps = (dispatch, ownProps) => {
  // ...
};

Or, it can alternatively be written as follows:

const mapDispatchToProps = {
  // ...
};

While mapStateToProps grants us access to the store to read data, mapDispatchToProps allows us to change the store’s data with write access. The mapDispatchToProps function’s signature looks similar to that of mapStateToProps. However, instead of receiving the whole state as a first parameter, we receive the dispatch method of the store that we connect to. The second parameter of mapDispatchToProps form ownProps ...