如何在另一个之后构建获取请求？答案

【问题标题】：How do I structure a fetch request after an other?如何在另一个之后构建获取请求？
【发布时间】：2022-01-25 11:33:49
【问题描述】：

我有一个 React 博客，我使用 Firebase 作为后端。我使用 createUserWithEmailAndPassword 方法，并在身份验证后将用户重定向到可以开始添加博客的博客。

我将他们的帖子存储在 Firestore 集合“帖子”中。没问题。

我还希望在使用用户首选项登录后创建一个用户对象。假设每个人都选择了一个特定的主题。

我在 firestore 创建了一个名为“users”的集合，我将使用 addDoc 方法存储每个对象 {user: "random@hotmail.com, theme: "dark" ,isAdmin: false, etc}。

我希望这个对象创建一次，而不是每次用户登录时。

如果用户已经存在，如何检查“用户”集合？

我得到集合 getDocs(userCollectionRef) 然后我过滤数据让我们说一个属性来看看那里是否有那个对象。

如果不是，我想使用 addDoc 方法添加文档。

这是请求：

useEffect(() => {
  const createUserData = async () => {
    const data = await getDocs(usersCollectionRef);
    const docs = data.docs.map((doc) => ({
      ...doc.data(),
      id: doc.id,
    }));
    const userData = docs.filter((doc) => doc.user === user.email);

    if (userData.length === 0) {
      await addDoc(usersCollectionRef, {
        user: user.email,
        isAdmin: false,
        theme: "dark",
      });
    }
  };
  if (user) {
    createUserData();
  }
}, [user, usersCollectionRef]);

看来我正在尝试同时检查并添加到集合中，这就是它不起作用的原因。

有什么想法吗？

我是否应该有一个中间步骤，将我从 getDocs 中获得的内容存储在一个状态或其他东西中，然后执行第二个请求？

谁能解释一下？

【问题讨论】：

标签： reactjs firebase google-cloud-firestore fetch

【解决方案1】：

我将 if 语句更改为这样的 return 并且它起作用了。

 return (
    userData.length === 0 &&
    (await addDoc(usersCollectionRef, {
      user: user.email,
      wordGoal: wordGoal,
    }))
  );

我想我会在第一个承诺之后返回第二个承诺，这就是为什么

【讨论】：

【解决方案2】：

我猜当 getDocs 请求发生时，因为它是异步的，然后数据为空，然后代码继续执行 if 语句，此时该语句为真（我们没有记录）并执行它。

【讨论】：