Вложение asyn c функций с помощью .then () - PullRequest
Новая
       9

Вложение asyn c функций с помощью .then ()

0 голосов
/ 17 апреля 2020

Повторное посещение веб-разработчика через некоторое время, и я хочу связать воедино асинхронные функции без старой парадигмы ада обратного вызова

Итак, в моем приложении React есть компонент входа в систему с onFini sh функция (с использованием AntD): 

onFinish(values) {
    const req = {
      email: values.email,
      password: values.password
    }
    userService.getUser(req)
      .then((res) => console.log('complete', res))
      .catch((err) => console.log(err))
  }

И у меня есть сервисный уровень, созданный для соединения с моим API: 

//In userService.js
async function getUser(req) {
  console.log(req);
  axios
    .get("/api/user", {params: {email: req.email, password: req.password}
  })
    .then((res) => {
      if (res.data) {
        console.log('we have data');
        return res.data;
      } else {
        console.log('no data');
        return res.data;
      }
    })
    .catch((err) => console.log(err));
}

Я бы хотел для обоих журналов консоли в userService.getUser(req) до sh, прежде чем мы перейдем к .then() в функции onFinish(). Когда я проверяю неверный логин, мой вывод на консоль 

Object { email: "XX@XX.com", password: "XX" } user.service.js:27
complete undefined login.component.js:22
no data user.service.js:36

Любое руководство о том, что мне не хватает? Хотелось бы также понять, куда бы я поместил окончательную третью функцию saveJWTToken(user), которая запускается даже после завершения userService.getUser(req), но его выходные данные должны быть возвращены до onFinish()

1 Ответ

2 голосов
/ 17 апреля 2020

Есть две вещи, которые вам нужно знать,

Во-первых, вам нужно вернуть запрос из функции getUser Во-вторых, если вы ловите ошибку в другом месте, вам не нужно ее ловить в пользовательском запросе

Кроме того, поскольку обещания являются связными, вы можете вызвать saveJWTToken(user) in .then getUser 

//In userService.js
function getUser(req) {
  return axios
    .get("/api/user", {params: {email: req.email, password: req.password}
  })
    .then((res) => {
      if (res.data) {
        console.log('we have data');
        return res.data;
      } else {
        console.log('no data');
        return res.data;
      }
    }).then(() => {
        const token = saveJWTToken(user);
        return {user, token}
    })
}
...