order of execution in useEffect clean up

Question

  useEffect(() => {
    return history.replace({
      pathname: "path/A",
    });
  }, []);

  useEffect(() => {
    return history.replace({
      pathname: "path/B",
    });
  }, []);

When the component unmounts, what will be the URL? What determines the order of execution of the above 2 useEffect ?

Answer 1

Due to the nature of you passing no deps ; both of these useEffect s will only be rendered on component mount. Therefore, the result is (and always will be) "path/B" .

If you wanted it to change on component unmount, you'd need to add a return function to one of them.

useEffect(() => {
    history.replace({ pathname: "path/B" });
    return () => history.replace({ pathname: "path/B" });
}, []);