use-immer-ref

use-immer-ref

Manage state with immer, useRef more conveniently!

Install

$ npm install immer use-immer-ref
$ yarn add immer use-immer-ref

Usage

import { useImmerRef } from 'use-immer-ref';

const ExampleComponent = () => {
  const [state, setState, ref] = useImmerRef({
    count: 0,
  })
  return (
    <div>
      <button onClick={() => {
          setState(dr => {
            dr.count = 1;
          })
          console.log(ref.current.count) // console.log result => 1
          // ref.current will be changed to the latest value immediately
        }}>
        add count
      </button>
      <div>
        count is {state.count}
      </div>
    </div>
  );
};