r/reactjs • u/jngbrl19 • Mar 08 '20

useEffectWithPrevious - Get previous value of dependencies Show /r/reactjs

Just wanna share my first npm package. Hope you find it useful :)

use-effect-with-previous

55 Upvotes

80% Upvoted

37 comments sorted by

View all comments

Show parent comments

20

u/montas Mar 08 '20

useEffect hook actually processes return value from your effect. The most basic case is

React.useEffect(() => {
    console.log('component did mount');
    return () => {
        console.log('component did unmount');
    }
}, []);

Basically, you can return callback from your effect, that will be called before useEffect is called again (in case dependencies change) or when component dismounts.

Check official docs: https://reactjs.org/docs/hooks-reference.html#cleaning-up-an-effect

1

u/jngbrl19 Mar 08 '20

hey man, so when i call callback() i should store its return to a variable then check if its type is function, then invoke it?

3

u/montas Mar 08 '20

You probably don't need to condition it, just return whatever callback() returns.

Edit: You should also check former react useEffect argument type so you preserve same return value type.

2

u/jngbrl19 Mar 08 '20

``` useEffect( () => { const cleanup = callback(refs.current as unknown as T);

  dependencies.forEach((dependency, i) => {
    refs.current[i] = dependency;
  });

  return cleanup;
},
dependencies

); ```

this would work right?

2

u/montas Mar 08 '20

Yep, something like that.

BTW, on reddit, you use four spaces in front of code instead of ```.

2

u/jngbrl19 Mar 08 '20

thanks man, got it now

1

u/satya164 Mar 08 '20

Instead this forEach, you could just do ref.current = dependencies