Why this, highlighted, code won't work in React instead of useEffect?

I was told not to use if statement in place of React.useEffect() cause it would result in an endless loop. Now, that it’s no longer an endless loop why this does not work?

var counter = 0;

export default function App() {

  const [isLoggedIn, setIsLoggedIn]= React.useState(false);

  if((localStorage.getItem('loginStatus')==='Logged In') && counter===0) {
    setIsLoggedIn(true);
    counter++;
  }
}

>Solution :

because you’re using the setIsLoggedIn method while the hooks aren’t fully initialized yet.
Instead you have to replace your hook initialization to the following:

const [isLoggedIn, setIsLoggedIn] = React.useState((localStorage.getItem('loginStatus')==='Logged In') && counter===0);

Leave a Reply