Reactjs 无法在React中使用localstorage中的令牌

我有下面的代码，我正在本地存储中存储userId和token。当我刷新页面/admin时，我仍然会被重定向到/login，就好像我没有登录一样

“userData”存储在localStorage中，密钥为“userId”和“token”

初始登录也有效，只有当我刷新时，我才能回到登录页面

我错过了什么

const-App=（）=>{
const[token，setToken]=useState（false）；
const[userId，setUserId]=useState（false）；
const login=useCallback（（uid，令牌）=>{
setToken（token）；
setUserId（uid）；
localStorage.setItem(
“用户数据”，
stringify（{userId:uid，token:token}）
);
}, []);
const logout=useCallback（（）=>{
setToken（空）；
setUserId（null）；
localStorage.removietem（“userData”）；
}, []);
useffect（（）=>{
const storedData=JSON.parse（localStorage.getItem（“userData”）；
if（storedData&&storedData.token）{
log（`storedData.userId:${storedData.userId}`）；
log（`storedData.token:${storedData.token}`）；
登录名（storedData.userId、storedData.token）；
}
}，[登录]；
让路；
log（`isLoggedIn:${token}`）；
如果（令牌）{
路线=(
);
}否则{
路线=(
);
}
返回(
{routes}
);
};
导出默认应用程序问题在于您正在检查令牌是否为真：

 if (token) {
routes = (
  <Switch>
    <Route path="/admin">
      <Admin />
    </Route>
    <Redirect to="/admin" />
  </Switch>
);
 } else {
routes = (
  <Switch>        
    <Route path="/map">
      <Map />
    </Route>
    <Redirect to="/login" />
  </Switch>
  );
}

您可以做的是在第一个渲染周期中检查标记是否存在于localStorage中（useEffect带有空数组参数），并将标记设置为true（如果存在）。
如果查看本地存储，是否看到标记和id？是的，该部分工作正常。我添加了一个useEffect和一个空数组，用于检查localStorage并设置标记（setToken）但它仍然不起作用。与我最初描述中的行为相同。您可以更新问题以添加新代码或stackblitz链接吗？您还可以使用LocalStorage中的值初始化令牌状态。
const [token, setToken] = useState(false);