DEV Community

Discussion on: React progress bar on page load/route change(both Next js & CRA)

Collapse
 
ankitsahu01 profile image
Ankit Sahu • Edited

Most Welcome... one more thing is that the code which i wrote above having a Warning -> React Hook useEffect has a missing dependency: 'prevLoc'

To get rid of it simply modify few more things --->

const [progress, setProgress] = useState(false);
const [prevLoc, setPrevLoc] = useState({});
const location = useLocation();

useEffect(() => {
setPrevLoc(location);
setProgress(true);
window.scrollTo(0, 0); //Go to top on every page load
}, [location]);

useEffect(() => {
setProgress(false);
}, [prevLoc]);