Разрешить обещание в редукторном редукторе?

Question

У меня есть проектactjs, который использует Redux. Я делаю следующий запрос на получение:

function fetchQuote() {
  return fetch("http://localhost:8080/quote").then(function (response) {
    if (!response.ok) {
      throw Error(response.statusText);
    }
    // Read the response as json.
    return response;
  })
    .then(function (response2) {
      // Do stuff with the JSON
      return response2.text();
    })
    .then(function (response3) {
      return response3
    })
    .catch(function (error) {
      console.log('Looks like there was a problem: \n', error);
    })
}

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

export const getQuote = () => ({ type: 'GET_QUOTE', payload: fetchQuote() });

Затем идет к редуктору:

const quoteReducer = (state = { title: 'test', id: 1 }, action) => {
  switch (action.type) {
    case GET_QUOTE:
      console.log(action);
      return [...state, action.payload];
    default:
      return state;
  }
};

Однако, когда я console.log(action) получаю следующее:

{type: "GET_QUOTE", payload: Promise}
payload
:
Promise
__proto__
:
Promise
[[PromiseStatus]]
:
"resolved"
[[PromiseValue]]
:
"tes11t"
type
:
"GET_QUOTE"

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

Answer 1

Это потому, что getQuote передает Promise редуктору, а не возвращаемое значение. Но ты это знаешь.

Это сценарий, когда необходимо выполнить некоторую операцию асинхронно и диспетчеризировать действия, которые возвращают значение этих асинхронных операций , когда они завершаются. Вы не можете сделать это в Object, который вы передаете, но вы можете использовать промежуточное программное обеспечение Redux. Существуют библиотеки, предназначенные для решения таких проблем, как redux-thunk, redux-saga, redux-observable и другие.