React Redux Thunk fetch: выполнить действие в зависимости от результата отправки / выборки

Используя React & Redux & Redux-Thunk, пытаясь сделать этот псевдокод:

    // pseudocode
    dispatch(makeServiceRequest)
    if failed
      dispatch(makeIdentityRequest)
      if successful
        dispatch(makeServiceRequest)
      end
    end

Хотите избежать бесконечного цикла, который мог бы произойти, если бы код был помещен в блок .catch makeServiceRequest.

Я использую логику fetch(url).then(...).catch(...) в действии отправки. fetch не отклоняет ошибки статуса HTTP.

Как мне сделать этот псевдокод? Как правильно поступить в такой ситуации?


person csi    schedule 26.01.2017    source источник


Ответы (1)


Просто имейте then, который проверяет статус HTTP и выдает ошибку, если это не успешный статус, как указано в вашей ссылке:

function checkStatus(response) {
  if (response.status >= 200 && response.status < 300) {
    return response
  } else {
    var error = new Error(response.statusText)
    error.response = response
    throw error
  }
}

fetch(url).then(checkStatus).then(...).catch(...);

Кроме этого, я не понимаю, какой у вас вопрос, связанный с Redux.

Изменить: основываясь на ваших комментариях, я думаю, вы спрашиваете, как управлять действиями Redux, которые при отправке могут асинхронно отправлять другие действия. Один из способов смоделировать это - «сагу». Существует библиотека Redux под названием redux-saga, которая позволяет моделировать подобные вещи.

person Brandon    schedule 26.01.2017
comment
dispatch (makeServiceRequest) выполняет вышеуказанный fetch.then.catch код. Однако в случае неудачи следует makeIdentityRequest, а затем снова попробовать makeServiceRequest. В вашем примере линии разрыва будут попадать в ловушку, верно? Если это так, makeIdentityRequest & второй makeServiceRequest должен быть либо синхронным, либо второй makeServiceRequest должен быть в ловушке makeIdentityRequest. синхронизация может означать бесконечный цикл, а в catch - непреднамеренное поведение для остальной части приложения. Я правильно понимаю? Спасибо. - person csi; 26.01.2017