Javascript 在页面之间传递变量
我有一个来自firebase的uid,但它的存储方式如下: checkout.jsJavascript 在页面之间传递变量,javascript,reactjs,firebase,firebase-authentication,Javascript,Reactjs,Firebase,Firebase Authentication,我有一个来自firebase的uid,但它的存储方式如下: checkout.js firebase.auth().onAuthStateChanged((user) => { if(user) { console.log(user.uid) } }); user.uid存储我需要传递到另一个页面的uid。这个uid存储在checkout.js中,我需要将它放到profile.js中才能使用那里的uid。我该怎么做? 如果需要更多代码,请告诉我。我正在使用react
firebase.auth().onAuthStateChanged((user) => {
if(user) {
console.log(user.uid)
}
});
user.uid
存储我需要传递到另一个页面的uid。这个uid存储在checkout.js
中,我需要将它放到profile.js
中才能使用那里的uid。我该怎么做?
如果需要更多代码,请告诉我。我正在使用react/js我只是将代码复制并粘贴到
profile.js
中,它就成功了 使用上下文存储
创建存储和挂钩
const FirebaseAuthContext = createContext()
export function useAuth() {
const context = useContext(FirebaseAuthContext)
if (!context && typeof window !== 'undefined') {
throw new Error(`useAuth must be used within a FirebaseAuthContext`)
}
return context
}
创建提供者
export function FirebaseAuthProvider(props) {
const [authState, setAuthState] = useState({
isLoggedIn: false,
currentUser: null,
pending: true,
})
useEffect(() => {
const unregisterAuthObserver = auth().onAuthStateChanged(async (currentUser) => {
if (currentUser) {
setAuthState({. isLoggedIn: true, pending: false, currentUser})
} else {
setAuthState({ ...authState, currentUser: null, pending: false })
}
})
return () => unregisterAuthObserver()
}, [])
return <FirebaseAuthContext.Provider value={authState}>{props.children}</FirebaseAuthContext.Provider>
这可能奏效,但远不是实现这一目标的正确(更好)方法。这可以使用状态管理框架(如Redux)或内置上下文或使用cookie来完成。
<FirebaseAuthProvider><App /></FirebaseAuthProvider>
const { currentUser, pending } = useAuth();
if (currentUser && pending) //pending authentication
if (currentUser) // user is login, uid is in currentUser.uid