使用use effect in React Context检查本地存储中是否已有令牌的最佳方法

const TokenContext = React.createContext();

const [token, setToken] = useState(null);

return (
  <TokenContext.Provider value={{ token, setToken }}>
    {/* 子组件 */}
  </TokenContext.Provider>
);

const { token, setToken } = useContext(TokenContext);

useEffect(() => {
  const storedToken = localStorage.getItem('token');
  if (storedToken) {
    setToken(storedToken);
  }
}, []);

useEffect(() => {
  if (token) {
    localStorage.setItem('token', token);
  } else {
    localStorage.removeItem('token');
  }
}, [token]);