Attach effect callbacks to useState
updates.
Sometimes you have some related code that should run in parallel with your state updates. While useEffect
is the default way to achieve this, it does involve some ceremony, and may also hinder colocation.
use-state-with-effect
solves this by exposing a simple function, withEffect
. This function merely takes the result returned from useState
and a callback function, and then wraps wraps the update function with the provided effect.
Getting started is quick and simple!
npm install use-state-with-effect
Then, in your component:
import { withState } from 'use-state-with-effect';
const MyComponent = () => {
const [state, setState] = withEffect(useState(), (prevValue, newValue) => {
console.log({ prevValue, newValue });
});
};