我對反應很陌生，我試圖從 firebase 數據庫加載個人資料圖片。即使該屬性不為 null，它仍然會顯示 TypeError: Cannot read property 'pfpUrl' of null。import React from "react"import { NavLink } from "react-router-dom";import { useState, useEffect } from "react"import firebase from "firebase";import fire from "./firebase"import { useHistory } from "react"function Header(){        const [pfp, setPfp] = useState(null)        const [userID, setUserID] = useState(null);        firebase.auth().onAuthStateChanged((user)=>{            if(user){                setUserID(user.uid)                firebase.database().ref("users/"+userID+"/public/profile/pic").on("value", (snapshot)=>{                    setPfp(snapshot.val().pfpUrl)                })            }else{                            }         })        function signOut(){            firebase.auth().signOut().then(()=>{                console.log("successfully signout")            })        }        return(            <header>                                <div id = "hd-container">                    <div id = "logo-contain">                        <NavLink to = "/"><h1>Logo</h1></NavLink>                    </div>                    <div id ="search">                        <div className = "bar">                            <input id = "searchBar" placeholder = "search"></input>                        </div>                        <div className = "searchBtn">                            <button id = "srhBtn">Search</button>                            </div>                                       </div>即使加載了個人資料圖片，錯誤仍然出現，有解決辦法嗎？