javascript - 我是否必须等待 useEffect 中已经异步的异步函数？

Question

假设我下面有以下代码，并且我在 useEffect 函数中调用我的函数 usersaApi.getUsersId 它，我是否必须做出响应(因为它返回值，而不是 Promise)异步函数？

const usersApi = {
  getUserIds: async storyId => {
    const result = await axios
      .get(`${users + userId}.json`)
      .then(({ data }) => data);

    return result;
  },
}

useEffect(() => {
    const fetchData = async () => {
      await usersApi.getUserIds().then(data => setUserIds(data));
    };

    fetchData();
}, []);

使用之间有什么区别:

const fetchData = async () => {
    await usersApi.getUserIds().then(data => setUserIds(data));
};

对比

const fetchData = async () => {
     const result = await usersApi.getUserIds().then(data => setUserIds(data));

     return result;
};

我想我可以只等待响应而不返回结果，对吗？这里有两个问题:

1) 我是否必须在已经是 async/await 的函数上使用 async/await2) 在已经返回数据的函数上使用await 和return 之间的区别，而不是promise。

Answer 1

1) Do I have to use async/await on a function that is already async/await

由您决定要使用什么语法。您可以使用 async/await，也可以使用旧的 .then 样式。就我个人而言，我发现 async wait 风格更容易理解，所以我个人更喜欢它。不过，我建议反对混合使用这两种语法。几乎没有必要这样做，而且最终只会使代码更难理解。要么写:

const fetchData = async () => {
  const data = await userApi.getUserIds();
  setUserIds(data);
}

或者:

const fetchData = () => {
  userApi.getUserIds.then(data => setUserIds(data));
}

2) The difference between using await & return on a function that already returns data, not promises.

Async/await 的存在是为了简化使用 Promise 的语法。如果您不使用 Promise，则不需要 async/await。