В React / Redux нормально ли делать обобщенную c отправку в качестве реквизита для отправки какого-либо действия вообще?

Question

В одном из ответов Дана Абрамова есть код

// action creator
function loadData(dispatch, userId) { // needs to dispatch, so it is first argument
  return fetch(`http://data.com/${userId}`)
    .then(res => res.json())
    .then(
      data => dispatch({ type: 'LOAD_DATA_SUCCESS', data }),
      err => dispatch({ type: 'LOAD_DATA_FAILURE', err })
    );
}

// component
componentWillMount() {
  loadData(this.props.dispatch, this.props.userId); // don't forget to pass dispatch
}

Кажется, mapDispatchToProps просто отображает отправку c в качестве реквизита (как this.props.dispatch) таким образом, этот компонент может отправлять любое действие вообще?

Во-первых, это хорошая форма или это просто пример, но мы должны сделать это конкретно c диспетчеризацией, такой как this.props.dataReceived?

Во-вторых, так как для приведенного выше кода, mapDispatchToProps будет записано как:

const mapDispatchToProps = dispatchOfReduxStore => {
  return {
    dispatch: dispatchOfReduxStore
  }
}

или даже просто:

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

и упрощено до:

const mapDispatchToProps = dispatch => ({ dispatch })

и this.props.dispatch становится универсальной отправкой?

Я также обнаружил, что когда мы просто опускаем mapDispatchToProps в connect(), то this.props.dispatch автоматически доступно.

Answer 1

Я думаю, что основная причина для привязки dispatch к вашим действиям с помощью mapDispatchToProps состоит в том, чтобы скрыть избыточность от подключенного компонента.

Без привязки dispatch, ваш компонент должен знать, что ваши действия и помните, что они ничего не делают, не вызывая их в качестве параметра для dispatch.

С привязкой ваш компонент просто знает, что он имеет эти функции в props, которые он может просто вызывать при необходимости.

Другим преимуществом был бы, возможно, более чистый код, поскольку вы можете просто позвонить this.props.myAction() вместо this.props.dispatch(myAction()).

Я не думаю, что это сложно или неправильно. Я думаю, что отчасти это предпочтение. Я предпочитаю писать свои компоненты там, где они знают только о данных реквизитах. Но вы можете указать, что ваш компонент использует избыточность для отправки действий.