IT技术 - 在 React 中刷新页面后如何使用 localStorage 来维护状态 - 吾爱随笔录

每次用户登录时，即使页面重新加载，我也希望状态保持为“真”。状态最初设置为 false，（让 _authed = false）。但是当我重新加载页面时，它又回到了 false，也就是索引页面。

我做了什么当用户登录时，我将用户的详细信息保存在 localStorage 中，当用户注销时，我清除了 localStorage 并将其设置为 false。（这工作正常）

在 setAuthed() 函数中，我尝试检查我存储在 localStorage 中的用户是否不为 null，它应该将 authed 变量保持为 true。

但是当我刷新页面时它不起作用。有什么事吗，我做错了吗？帮助表示赞赏。

let _authed = false;

// User logs in, set user in localStorage
saveUser(user){
  _user = user;
  localStorage.setItem('user', JSON.stringify(user))
},

//User clicks logout, set state to false 
setLogout(){
  _authed = false;
  localStorage.clear()
},

 // If there is a user in local storage, always set state to true
setAuthed(){
     if (localStorage.getItem("user") !== null) {
      _authed = true;
      }
},


getAuthed(){
  return _authed;
},

class Root extends React.Component { state = { isLoggedIn: false } componentDidMount () { const persistState = localStorage.getItem('rootState'); if (persistState) { try { this.setState(JSON.parse(persistState)); } catch (e) { // is not json } } } componentWillUnmount () { localStorage.setItem('rootState', JSON.stringify(this.state); } render () { return ( <div> {this.props.children} </div> ) } }