Асинхронная функция автоматического возврата - PullRequest
0 голосов
/ 31 августа 2018

Я использую реагирует на редукцию , чтобы создать создателя действий в моем приложении. Дело в том, что когда я использую синтаксис async await , он автоматически возвращает обещание (без ключевого слова return) . Однако, когда я использую обещание в старом стиле, например then () , я должен явно ввести ключевое слово "return" - в противном случае оно вернет undefined. Почему это происходит?

app.js (createStore):

app.get('*', (req, res) => {
  const store = createStore(reducers, applyMiddleware(reduxThunk));
  const promise = matchRoutes(RouteApp, req.path).map(({ route }) => {
    return route.loadData ? route.loadData(store) : null;
  });
  console.log(promise);
  Promise.all(promise).then(() => {
    res.send(renderApp(req, store));
  });
});

route.js:

export default [
  {
    loadData,
    path: '/',
    component: Landing,
    exact: true,
  },
];

landing.js

function loadData(store) {
  return store.dispatch(fetchUser());
}
export { loadData };

Когда я использую асинхронное ожидание :

action.js

export const fetchUser = () => async (dispatch) => {
  const res = await axios.get('https://react-ssr-api.herokuapp.com/users');
  dispatch({
    type: INFO_USER,
    payload: res.data,
  });
};

enter image description here

Когда я использую обещание, тогда :

// It doesn't work
export const fetchUser = () => (dispatch) => {
  axios.get('https://react-ssr-api.herokuapp.com/users').then((res) => {
    dispatch({
      type: INFO_USER,
      payload: res.data,
    });
  });
};

enter image description here

"возврат" ключевое слово

// now it works
export const fetchUser = () => (dispatch) => {
  return axios.get('https://react-ssr-api.herokuapp.com/users').then((res) => {
    dispatch({
      type: INFO_USER,
      payload: res.data,
    });
  });
};

1 Ответ

0 голосов
/ 31 августа 2018

async функция всегда возвращает обещание, это его цель. Если возвращаемого значения нет, возвращается обещание undefined.

Как ссылка состояний,

Возвращаемое значение

Обещание, которое будет разрешено со значением, возвращаемым асинхронным функция или отклонена с неперехваченным исключением изнутри асинхронная функция.

Эта async функция

export const fetchUser = () => async (dispatch) => {
  const res = await axios.get('https://react-ssr-api.herokuapp.com/users');
  dispatch({
    type: INFO_USER,
    payload: res.data,
  });
};

является синтаксическим сахаром для этой функции:

export const fetchUser = () => (dispatch) => {
  return axios.get('https://react-ssr-api.herokuapp.com/users').then((res) => {
    dispatch({
      type: INFO_USER,
      payload: res.data,
    });
  });
};
...