Как выразить действие REQUEST / START через redux-действия?

Question

Я хочу использовать redux-действия, чтобы упростить мой код response-redux, но у меня возник вопрос:

Скажем, у меня есть действие "загрузить", которое выбирает некоторые темы из удаленного. поэтому код будет:

const load = createActions('LOAD');

export function fetch() {
  return (dispatch, getState) => {
    dispatch(fetchTopicsRequest());   // <- here is my question.
    return network
      .request('/topics?' + qs.stringify(getState().topics.filter.options))
      .then(network.handleResponse)
      .then(result => dispatch(load(result)))     // <- here I got the topics in the payload
      .catch(error => dispatch(load(error)));     // <- here I got the errors in the payload, in the reducer I check on the "error" field to see if the request successed.
  };
}

Я думаю, что хорошо, что результат и ошибка были отправлены одним действием. но как насчет выражения статуса "Запрашивающий" одним и тем же действием? как и в приведенном выше коде, я не понял этого, поэтому мне пришлось сделать еще одно действие "fetchTopicsRequest()", что делает весь код таким странным.

Из раннего осознания я заметил, что должно быть поле "статус", в таком случае это может быть удобно. куда это делось? или я просто пропустил какую-то лучшую идею?

Спасибо

Answer 1

Во-первых, я хотел бы исправить ваше понимание того, что вы называете действиями. В вашем случае функция fetch() является создателем действий, который способен отправлять действия, load(result) а также load(error) фактические отправляемые действия.

Теперь, когда вы ищете лучшую реализацию вашего fetchTopicsRequest() действие, поэтому я бы предложил вам использовать традиционный способ написания действия. В вашем случае это будет примерно так:

dispatch({type: 'FETCHING_TOPICS'});

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

ОБНОВИТЬ:

Чтобы справиться с pending В случае, если вы можете использовать состав действия и редуктора. Однажды FETCHING_TOPICS действия отправляются тогда в вашем редукторе вы можете пометить pending как true и как только response затем вы можете изменить pending в false как это:

function reducer(state={pending: null}, action) {
  switch(action.type) {
    case 'FETCHING_TOPICS':
      return {...state, pending: true};
      break;
    case 'FETCHED_TOPICS':
      return {...state, pending: false, //payload if any};
      break;
    case 'FETCHING_ERR':
      return {...state, pending: false, //payload if any};
      break;
  }
}