order of execution in useEffect clean up

user_5432156 0
Viewed 56
  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?

reactjs javascript
1 Answers

Due to the nature of you passing no deps; both of these useEffects 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" });
}, []);
user_64259360
Related