反应 & Firebase 全球 State

Question

我正在使用react-firebase-hook ，我正在尝试检查用户是否是管理员，我希望它是一个全局的 state ，我不必在每个组件中添加此代码检查用户是否是管理员，这里是代码..

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();
});

我想将其作为全局 state，尝试使用 useContext 但我认为我使用它的方式不对，所以有人可以提供帮助吗？

Answer 1

您使用上下文是正确的，但是，您可能会像您所说的那样错误地使用它。 您应该设置一个上下文来处理当前登录的用户。 在这种情况下，您还可以从用户集合中获取用户的额外详细信息。

此外，您可以直接使用 ID 而不是where来获取用户：

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