use-share-state

React hook for share state between tabs/windows

Usage no npm install needed!

<script type="module">
  import useShareState from 'https://cdn.skypack.dev/use-share-state';
</script>

README

React Shared State Hook 🔗

React hook for state synchronization between (windows, tabs).

This hook is based on a broadcast-channel library that works in New Browsers, Old Browsers, WebWorkers and NodeJs.

Installation

$ npm install use-share-state

Usage

import useShareState from "use-share-state";

const App = () => {
  const [state, setState] = useShareState(0);

  const increment = useCallback(() => {
    setState(state + 1);
  }, [state]);

  const decrement = useCallback(() => {
    setState(state - 1);
  }, [state]);

  return (
    <div className="App">
      Counter: {state}
      <button onClick={increment}>+</button>
      <button onClick={decrement}>-</button>
    </div>
  );
}

License

MIT © Muslim Guseinov