Асинхронные функции

Question

У меня есть функция

export const setSearchField = text => dispatch => {
  dispatch({ type: REQUEST_GIFS_PENDING });
  fetch(API_URL + (text || DEFAULT_QUERY) + API_KEY + LIMIT)
    .then(response => response.json())
    .then(items =>
      dispatch({ type: REQUEST_GIFS_SUCCESS, payload: items.data })
    )
    .catch(error => dispatch({ type: REQUEST_GIFS_FAILED, payload: error }));
};

Теперь я хочу преобразовать ее в асинхронную функцию, я сделал это без try & catch, но она не работает

export const setSearchField = text => dispatch => {
  dispatch({ type: REQUEST_GIFS_PENDING });
  async function fetUsers(){
    const response = await fetch(API_URL + (text || DEFAULT_QUERY) + API_KEY + LIMIT);
    const items = await response.json();
    dispatch({ type: REQUEST_GIFS_SUCCESS, payload: items.data })
  }

Чтоя делаю неправильно?

Answer 1

Причина, по которой ваш код не работает, заключается в том, что вы никогда не вызываете созданную вами асинхронную функцию.Однако нет никакой причины делать внутреннюю асинхронную функцию;просто сделайте тот, который у вас уже есть async:

export const setSearchField = text => async (dispatch) => {
  dispatch({ type: REQUEST_GIFS_PENDING });
  try {
    const response = await fetch(API_URL + (text || DEFAULT_QUERY) + API_KEY + LIMIT);
    const items = await response.json();
    dispatch({ type: REQUEST_GIFS_SUCCESS, payload: items.data })
  } catch (error) {
    dispatch({ type: REQUEST_GIFS_FAILED, payload: error })
  }
}