I want to refresh the react page(functional component) only once when it first loads, not on any event but after first render, how to do that?

Deepeshkumar Pakhare 0
Viewed 20

I am trying to refresh/reload an page in a react functional component. But when i call

window.location.reload()

in useEffect() hook, the page keeps refreshing forever. I want it to refresh only once after it mounts. How to achieve that? So far I tried this:

useEffect(
    () => {
        setNotificationCount();
        window.location.reload();
    },[]
)
reload react-hooks reactjs javascript
1 Answers

You can store a flag inside the localStorage:

useEffect(
    () => {
        setNotificationCount();
        const alreadyLoaded = localStorage.getItem('alreadyLoaded');
        if (!alreadyLoaded) {
           localStorage.setItem('alreadyLoaded', true);
           window.location.reload();
        }
    },[]
)
moonwave990
Related