Блог

Когда я создаю проект с react.js и react-redux обычно я создаю файл действия отдельно от других файлов компонентов и импортирую action-creator с функцией connect в компонент следующим образом.

 import { deletePost } from "../../actions"; 

connect(mapStateToProps, { deletePost })(aComponent); 
 

Но после того, как я обнаружил существование функции mapDispatchToProps, удобнее отправлять действие в reducer непосредственно изнутри компонента.

 const mapDispatchToProps = (dispatch) => {
 return {
  deletePost: (id) => { dispatch({ type: 'DELETE_POST', id: id }) }
 }
}

connect(mapStateToProps, mapDispatchToProps)(aComponent); 
 

Правильно ли это использовать функцию mapDispatchToProps внутри компонента?

Правильно, это правильный способ интеграции mapDispatchToProps() в ваш компонент.

Лично я считаю, что mapDispatchToProps() это делает видимым, что может сделать ваш компонент. Это дает понять, что ваш компонент способен отправлять различные действия.

Типичная структура:

 const mapDispatchToProps = (dispatch) => {
  return {
    nameofActionCreator: (args) => {
      dispatch(nameOfActionCreator(args))
    }
  }
}