我目前正在将用户信息存储在我的React应用程序中的上下文对象中。

export const SessionContext = createContext(null);

export const SessionContextProvider = ({ children }) => {
  console.debug("RTS Break SessionContextProvider");

  const [user, setUser] = useState(null);
  const [userAuthorized, setUserAuthorized] = useState(false);
  const [userAuthToken, setUserAuthToken] = useState(null);
  const [sessionCustomer, setSessionCustomer] = useState(null);
  const [prevSessionCustomer, setPrevSessionCustomer] = useState(null); 
  const [appMode, setAppMode] = useState(null);
  const apiRoot = process.env.REACT_APP_API_URL;

  const userLogOut = () => {
    setUserAuthToken("");
    setUser(null);
    setUserAuthorized(false);
    setSessionCustomer(null);
    setPrevSessionCustomer(null);
  }

  const value = {
    user,
    setUser,
    userAuthorized,
    setUserAuthorized,
    userAuthToken,
    setUserAuthToken,
    sessionCustomer,
    setSessionCustomer,
    prevSessionCustomer,
    setPrevSessionCustomer,
    appMode,
    setAppMode,
    apiRoot,
    userLogOut
  };

  return(
      <SessionContext.Provider value={value}> {children} </SessionContext.Provider>
  );

};

export const useSessionContext = () => React.useContext(SessionContext);

正如您所看到的，我在这个Context对象中存储了许多不同的东西，包括子对象。为了让所有对象都能访问这些数据，我在App.js的提供程序中 Package 了我的主窗口。

export default function App(props) {
  return (
    <ThemeProvider theme={theme}>
      <SessionContextProvider>
        <BrowserRouter>
          <Box id="appBox">
            <Main />
          </Box>
        </BrowserRouter>
      </SessionContextProvider>      
    </ThemeProvider>
  );

我的上下文对象上的一些属性是在用户登录时设置的，而一些是在他们使用产品时设置的。下面是我的登录控件中的一些代码，它在用户成功通过身份验证后将数据保存到我的上下文对象中：

if (res.status === 200 && res.data.token) {
                    try{
                        setUserAuthToken({'token': res.data.token});
                    }
                    catch(err){
                        console.log("Token Error");
                        console.log(err);
                    }

                    try{
                        setUser(res.data.user);
                    }
                    catch(err){
                        console.log("User Data Error");
                        console.log(err);
                    }

                    try{
                        setUserAuthorized(true);
                    }
                    catch(err){
                        console.log("Authorization Error");
                        console.log(err);
                    }

我仍然是一个React的新手，所以我有几个问题。
1.我是不是用错了上下文？看起来我应该能够在上下文中存储对象并单独检索/更新它们，但不确定我是否误解了它的意图。
1.是否有一种方法可以将所有值保存到sessionStorage中，或者必须单独保存和检索每个值？
1.当用户点击刷新按钮时，如何从sessionStorage初始化这些值？
任何帮助这是赞赏。如果这是一个重复请指出我在正确的方向，因为我已经看过，似乎不能找到一个足够接近的问题。