Firebase V9注册新用户后如何将用户数据存入Firestore集合？

你的代码思路没问题，但有几个细节需要调整，确保数据正确存入Firestore：

1. 修复addDoc的数据结构问题 #

你当前把data对象嵌套在另一个对象里存入，会导致Firestore文档结构变成{ data: { id: "...", email: "...", username: "..." } }，这通常不是我们需要的结构。应该直接传入data对象：

addDoc(ref, data); // 替换原代码中的 { data }

2. 处理addDoc的异步错误 #

addDoc是异步操作，你当前没有处理它的错误，一旦存库失败，用户不会收到任何提示。可以通过两种方式完善：

方式一：延续Promise链 #

createUserWithEmailAndPassword(auth, email, password)
  .then((res) => {
    dispatch({ type: "LOGIN", payload: res.user });
    const uid = res.user.uid;
    const data = {
      id: uid,
      email,
      username,
    };
    const ref = collection(db, "users");
    return addDoc(ref, data); // 返回Promise继续链式调用
  })
  .then(() => {
    // 可选：存库成功后的额外操作
  })
  .catch((err) => {
    setError(err.message); // 现在会捕获注册或存库过程中的所有错误
  });

方式二：使用async/await（更易读） #

把signup改成异步函数，用try/catch包裹所有异步逻辑：

const signup = async (email: string, password: string, username: string) => {
  setError("");
  try {
    const res = await createUserWithEmailAndPassword(auth, email, password);
    dispatch({ type: "LOGIN", payload: res.user });
    const uid = res.user.uid;
    const data = {
      id: uid,
      email,
      username,
    };
    const ref = collection(db, "users");
    await addDoc(ref, data);
  } catch (err) {
    setError((err as Error).message);
  }
};

3. 可选：用用户UID作为文档ID #

如果希望Firestore文档ID和Auth的用户UID一致（方便后续通过UID快速查询用户），可以用setDoc替代addDoc：

const userDocRef = doc(db, "users", uid);
await setDoc(userDocRef, data);

这样文档ID就是用户的UID，而非自动生成的随机ID，后续查询用户数据会更直接。

4. 确认Firebase初始化正确 #

确保你的db实例是按照Firebase V9模块化写法正确初始化的：

import { initializeApp } from "firebase/app";
import { getFirestore } from "firebase/firestore";

const firebaseConfig = {
  // 你的Firebase项目配置信息
};

const app = initializeApp(firebaseConfig);
export const db = getFirestore(app);

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