Reactjs Firebase读取时使用react-useeffect异步，不等待文档读取

我在auth上下文中有下面的代码片段，其中我在上下文中设置了登录详细信息以及特定于用户的详细信息。但问题是代码退出useEffect块，即使我使用async来完成文档读取。但代码无论如何都要经过useEffect，之后将检索用户详细信息

我想在控件失效之前阅读该文档

请让我知道我做错了什么

    useEffect(() => {
        auth.onAuthStateChanged(user => {
            let userDetails : IUser = {
                landingPage: "error",
                permissions: {
                    'none' : {
                        'read' : false,
                        'write' : false
                    }
                },
                role: "none",
                shopId: "none"
            };
            if (user) {
                console.log("Read user data now");
                (async function some() {
                    await readDocument("users", user.uid,function (result: IUser) {
                        userDetails = result;
                        console.log("Result received in ", result);
                    });
                })();
            }
            return setState({
                ...authInitialState,
                isAuthenticated: !!user,
                isInitialized: true,
                permissions: userDetails.permissions,
                user: user,
                landingPage: userDetails.landingPage
            });
        });
    }, []);

readdocument函数

---

为了让

readDocument

与

wait

一起工作，它需要一个得到解决的承诺。-向下滚动至async/await部分

类似这样的东西（未经验证）-

---

为了让

readDocument

与

wait

一起工作，它需要一个得到解决的承诺。-向下滚动至async/await部分

类似这样的东西（未经验证）-

---

我试过这样的方法，效果很好。仍然不能100%确定区别是什么

const onChange = (user) => {
        console.log("State changed");
        let userDetails: IUser = {
            landingPage: "error",
            permissions: {
                'none': {
                    'read': false,
                    'write': false
                }
            },
            role: "none",
            shopId: "none"
        };

        if (user) {
            getDocument("users", user.uid)
                .then(function (result) {
                    userDetails = result.data();
                    setState({
                        ...authInitialState,
                        isAuthenticated: !!user,
                        isInitialized: true,
                        permissions: userDetails.permissions,
                        user: user,
                        landingPage: userDetails.landingPage
                    });
                });
        }
    }

useEffect(() => {
        auth.onAuthStateChanged((user) => onChange(user));
    }, []);

---

我试过这样的方法，效果很好。仍然不能100%确定区别是什么

const onChange = (user) => {
        console.log("State changed");
        let userDetails: IUser = {
            landingPage: "error",
            permissions: {
                'none': {
                    'read': false,
                    'write': false
                }
            },
            role: "none",
            shopId: "none"
        };

        if (user) {
            getDocument("users", user.uid)
                .then(function (result) {
                    userDetails = result.data();
                    setState({
                        ...authInitialState,
                        isAuthenticated: !!user,
                        isInitialized: true,
                        permissions: userDetails.permissions,
                        user: user,
                        landingPage: userDetails.landingPage
                    });
                });
        }
    }

useEffect(() => {
        auth.onAuthStateChanged((user) => onChange(user));
    }, []);

---

readDocument（“users”，user.uid）。然后（函数（result）{userDetails=result；console.log（“result received in”，result）；}）和```（异步函数some（）{wait readDocument（“users”，user.uid）。然后（函数（result）{userDetails=result；console.log（“result received in”，result）；}）；}（）；````不幸的是，产生了相同的结果。```函数readDocument（collection:string，docId:string）{console.log（“将要读取：”，docId）；返回新的承诺（（resolve，reject）=>{db.collection（collection.docId）.get（）。然后（函数（doc）{//callback（doc.data（））；解析（doc.data（））；console.log（“读取数据”，doc.id，=>”，doc.data（）；}）。catch（函数（错误）{console.log（“写入失败”，错误）；拒绝（错误）；}）；}）“``现在你的useEffect块只在componentDidMount上运行，这是你想要的吗？你可能需要观察某个属性，比如auth…useEffect（（）=>{//code/}，[auth]）；我想即使没有依赖项，它也会运行一次。谢谢你。
readDocument（“users”，user.uid）。然后（函数（result）{userDetails=result；console.log（“result received in”，result）；}）；
和````（异步函数some（）{wait readDocument（“users”，user.uid”）；然后（函数（result）{userDetails=result；console.log（“result received in”，result）；}）；}（）；``不幸地产生了相同的结果。```函数readDocument（collection:string，docId:string）{console.log（“Going to read:”，docId）；返回新的承诺(（resolve，reject）=>{db.collection（collection.doc（docId.get（））。然后（函数（doc）{//callback（doc.data（））；resolve（doc.data（））；console.log（“读取数据”，doc.id，=>，doc.data（））；}）。catch（函数（错误）{console.log（“写入失败”，错误）；拒绝（错误）；}）；“``现在您的useEffect块仅在componentDidMount上运行，这是您想要的吗？您可能需要监视某些属性，如auth…useEffect（（）=>{//code/}，[auth]））；我想即使没有依赖关系，它也会运行一次。谢谢。
const onChange = (user) => {
        console.log("State changed");
        let userDetails: IUser = {
            landingPage: "error",
            permissions: {
                'none': {
                    'read': false,
                    'write': false
                }
            },
            role: "none",
            shopId: "none"
        };

        if (user) {
            getDocument("users", user.uid)
                .then(function (result) {
                    userDetails = result.data();
                    setState({
                        ...authInitialState,
                        isAuthenticated: !!user,
                        isInitialized: true,
                        permissions: userDetails.permissions,
                        user: user,
                        landingPage: userDetails.landingPage
                    });
                });
        }
    }

useEffect(() => {
        auth.onAuthStateChanged((user) => onChange(user));
    }, []);