/Javascript/React/Reactive localstorage in react

Reactive localstorage in react

function useStorageWatcher(key) {
  const [val, setVal] = useState(localStorage.get(key));

  useEffect(() => {
    const handler = () => val !== localStorage.get(key) && setVal(localStorage.get(key));
    window.addEventListener("storage", handle);
    () => window.removeEventListener("storage", handler);
  }, []);

  useEffect(() => {
    setVal(localStorage.get(key));
  }, [key]);

  return val;

}

Source: reddit.com

Similar codes

3 votes199 views2 answers
Fetch data from api in react
Javascript React
8 votes182 views3 answers
Change title react
Javascript React
2 votes253 views2 answers
Set delay react native
Javascript React
1 vote194 views1 answer
How to run an existing react project
Javascript React
0 vote194 views2 answers
How to pass data in router link react-typescript
Javascript React
1 vote204 views1 answer
Has been blocked by cors policy react fetch firebase realtime database
Javascript React
0 vote207 views1 answer
Radio button default checked react
Javascript React
0 vote196 views1 answer
React-native-safe-area-context
Javascript React
0 vote198 views1 answer
React native picker not taaking height on android
Javascript React
4 votes186 views3 answers
Sleep in react
Javascript React