React和Firebase全局状态

zaq34kh6  于 2023-02-05  发布在  React
关注(0)|答案(1)|浏览(103)

我正在使用react-firebase-hook,我试图检查用户是否是管理员,我希望它是一个全局状态,在那里我不必在每个组件中添加此代码来检查用户是否是管理员,下面是代码。

import { useState, useEffect } from 'react';
import { query, collection, getDocs, where } from "firebase/firestore";
import { auth, db } from "../../config/fbConfig";
import { useAuthState } from "react-firebase-hooks/auth";
const CreateAnn = () => {
    const [ann, setAnn] = useState(''); // ignore this
    const [admin, setAdmin] = useState(false);
    const [user] = useAuthState(auth);
    const fetchAdmin = async () => {
        try {
          const q = query(collection(db, "users"), where("uid", "==", user?.uid));
          const doc = await getDocs(q);
          const data = doc.docs[0].data();
          if(data.admin === true) {
            setAdmin(true);
          }
          else { setAdmin(false); }
        } catch (err) {
          // do nothing
        }
    };
useEffect(() => {
    fetchAdmin();
});

我想把它作为一个全局状态,尝试使用上下文,但我想我用错了方法,所以有人能帮忙吗?

yqlxgs2m

yqlxgs2m1#

您使用上下文是正确的,但是,正如您所说,您可能会使用错误。您应该设置一个上下文来处理当前登录的用户。在此上下文中,您还可以从用户集合中获取用户的额外详细信息。
此外,您可以直接使用ID而不是获取用户,其中

const docRef = doc(db, "users", user.uid);
const docSnap = await getDoc(docRef);
const data  = docSnap.exists ? docSnap.data() : undefined

点击此链接设置auth correct的上下文。
https://dev.to/dchowitz/react-firebase-a-simple-context-based-authentication-provider-1ool

相关问题