I was very mistaken about the behavior of useCallback
hook.
I was under the impression that let's say if I had a code like this
const [value1, setValue1] = useState(null);
const [value2, setValue2] = useState(null);
const [value3, setValue3] = useState(null);
const foo = useCallback(() => console.log(value1, value2, value3), [value1, value2, value3])
and if I call a function that looks like this
function bar() {
setValue1(1);
setValue2(2);
setValue3(3);
foo();
}
I should always get a copy of the function foo
that has all the updated dependencies. Which means the output should be
1 2 3
But it isn't. It's
null null null
So I'm using the useCallback hook wrong. Is there a hook that does what I want from a useCallback hook?