访问未定义的路径或错误页面会导致Next.js进行硬刷新，从而导致我的上下文回到默认状态（即存储在userProfile状态变量中的值变为null）
我有一个布局，使用{stucture：Sidebar和main}，在Sidebar组件中，我显示用户电子邮件，我从上下文钩子作为状态变量获取。
但是，当我点击未定义的路径或在URL中手动输入时，我会抛出一个自定义错误页面，返回到索引页面（'/'），但由于这个原因，我失去了我的状态回到null（上下文）。
我的上下文文件如下所示
import { createContext, useState, useContext } from 'react';
const UserContext = createContext();
export function UserProvider({ children }) {
const [userProfile, setUserProfile] = useState(null);
return (
<UserContext.Provider value={{ userProfile, setUserProfile }}>
{children}
</UserContext.Provider>
);
}
export function useUserContext() {
return useContext(UserContext);
}
我在登录页面的登录处理程序中设置我的状态（成功时）。
是否有任何解决方法，或者我应该使用本地存储
目前，当他回到索引页面时，我会再次获取用户配置文件。
我认为本地存储可能是一个更好的选择。
我通过只在上下文文件中设置状态，而不在任何其他地方设置状态来解决了我的问题。简而言之，我在context.js文件中获取用户的个人资料数据，并在那里设置状态，这样可以在任何地方使用。如果有人遇到相同的问题，请提到我！
我的context.js文件如下所示
import { createContext, useState, useEffect, useContext } from 'react'; const UserContext = createContext(); export function UserProvider({ children }) { const [userProfile, setUserProfile] = useState(null); const [loading, setLoading] = useState(true); useEffect(() => { const fetchUserProfile = async () => { try { const res = await fetch(process.env.NEXT_PUBLIC_API_DOMAIN + '/userProfile'); const userData = await res.json(); setUserProfile(userData); setLoading(false); } catch (error) { console.error("Error fetching user profile:", error); setLoading(false); } }; fetchUserProfile(); }, []); return (
{children}
);
}
export function useUserContext() {
return useContext(UserContext);
}