React JS 对接 Firestore 时如何将新生成的文档UID存入文档内部

实现原理 #

调用无参数的doc()方法时，Firestore 会在客户端直接生成符合官方规则的唯一文档ID并返回对应文档引用，不需要等待写入请求完成即可提前拿到该ID。

修正后的代码 #

function CrearEstudiante({user}) {
    const register = (e) => {
        e.preventDefault();
        // 预生成文档引用，拿到自动分配的文档UID
        const estudianteDocRef = db
            .collection('usuarios')
            .doc(user.uid)
            .collection('estudiantes')
            .doc();
        // 提取新文档的UID
        const estudianteDocId = estudianteDocRef.id;
        // 写入数据时将文档UID存入对应字段
        estudianteDocRef.set({
            name: firstName + " " + lastName,
            school: idType1,
            grade: idType2,
            uid: estudianteDocId, // 替换为当前新文档的UID
            createUserUid: user.uid // 可选保留创建用户的UID，方便后续全局查询过滤
        }).then(() => {
            history.push("/Inicio")
        })
    }
}

错误原因说明 #

• 集合引用不存在uid/id属性，只有文档引用才有该属性，你之前直接对集合取ID的写法自然无效
• 不需要手动传入自定义ID，无参doc()生成的ID和服务端生成规则完全一致，不会出现ID冲突问题
• 后续如果需要对该新文档做其他操作，直接复用estudianteDocRef即可，不需要额外发起查询请求

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