I am trying to understand react useEffect hook

Question

Can anyone please explain how react useEffect hook is working as ComponentWillUnmount here. Also how the loading state is handled using firebase onAuthStateChanged?

const [loading, setLoading] = useState(false);

useEffect(() => {
  const auth = getAuth();
  const unsubscribe = onAuthStateChanged(auth, (user) => {
    setCurrentUser(user);
    setLoading(true);
  });
  return unsubscribe;
}, []);

Answer 1

useEffect will take the function that you return and run it eventually when your component is unmounted. This is indeed the similar to how ComponentWillUnmount works. If you don't want any action on unmount just don't return anything in your useEffect.

You can read more about it in the React effect hooks documentation.