React+Firebase注册添加用户校验后Firestore数据无法保存问题

• 异步执行顺序错误：handleSignUp中的sendEmailVerification、Firestore set、handleLogOut都是异步操作，你当前的写法没有等待前两个写操作完成就提前执行了登出。如果你的Firestore安全规则要求登录态才能写入（默认规则就是如此），登出后写入请求会因为没有权限被拦截。
• 没有正确传递异步状态：handleSignUp没有返回Promise，checkUser调用它之后无法感知内部异步操作的完成状态，后续的路由跳转/状态更新很可能打断未完成的写入请求。

首先修改handleSignUp，把异步操作按正确顺序编排，等待写入和发验证邮件完成后再登出，同时返回Promise方便外部调用：

const handleSignUp = async () => {
  clearErrors();
  try {
    const userCredential = await fb.auth().createUserWithEmailAndPassword(email, password);
    // 并行执行发验证邮件和写入Firestore，两个都完成再往下走
    await Promise.all([
      userCredential.user.sendEmailVerification(),
      fb.firestore().collection("links").doc("Andres").set({ name: "Andres" })
    ])
    // 所有操作完成再登出
    handleLogOut();
    alert("Email sent");
  } catch (err) {
    switch (err.code) {
      case "auth/email-already-in-use":
      case "auth/invalid-email":
        setEmailError(err.message);
        break;
      case "auth/weak-password":
        setPasswordError("Contrasena debil");
        break;
    }
  }
};

再修改checkUser，等待handleSignUp所有异步操作执行完成后再走后续逻辑：

const checkUser = async (avatar) => {
  var docRef = fb.firestore().collection("links").doc(user2);
  var doc = await docRef.get();
  if (doc.exists) {
    //invalidUsername(true);
    console.log("error");
  } else {
    // 等待handleSignUp执行完成
    await handleSignUp();
    console.log("Working");
    //history.push("/");
  }
};

提示：当前你Firestore写入的文档ID写死为了Andres，多用户场景下记得替换为动态的用户唯一标识，避免数据覆盖。

内容的提问来源于stack exchange，提问作者Andres Pelaez