/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

0 vote315 views1 answer
How to disable button if errors object isnt empty in react hook form
Javascript React
2 votes352 views2 answers
Capture enter button react input
Javascript React
0 vote306 views1 answer
React-with-firebase-auth
Javascript React
0 vote322 views1 answer
How to add css based on route react
Javascript React
1 vote331 views1 answer
React router dom 6 go back
Javascript React
0 vote327 views1 answer
ExoPlayer with auto linking react native
Javascript React
1 vote389 views1 answer
How to add two elements in one path in react router v6
Javascript React
0 vote325 views1 answer
Remove stack header bottom line react native
Javascript React
1 vote348 views2 answers
React alert popup
Javascript React
0 vote320 views1 answer
Reactjs Developer
Javascript React