use-immer-ref

Manage state with immer, useRef more conveniently!

Install

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

Usage

1import { useImmerRef } from 'use-immer-ref';
2
3const ExampleComponent = () => {
4  const [state, setState, ref] = useImmerRef({
5    count: 0,
6  })
7  return (
8    <div>
9      <button onClick={() => {
10          setState(dr => {
11            dr.count = 1;
12          })
13          console.log(ref.current.count) // console.log result => 1
14          // ref.current will be changed to the latest value immediately
15        }}>
16        add count
17      </button>
18      <div>
19        count is {state.count}
20      </div>
21    </div>
22  );
23};