useCallback usage

[Les Szklanny]

Should the decrement and increment functions be wrapped in useCallback?

function useCounter(initialState = 0) {
  let [count, setCount] = useState(initialState)
  let decrement = () => setCount(count - 1)
  let increment = () => setCount(count + 1)
  return { count, decrement, increment }
}

let Counter = createContainer(useCounter)

[Les Szklanny]

I found an answer.

function useCounter() {
  let [count, setCount] = useState(0)
  let decrement = useCallback(() => setCount(count - 1), [count])
  let increment = useCallback(() => setCount(count + 1), [count])
  return { count, decrement, increment }
}

[Jamie Kyle]

The best possible way you could do it is actually this:

let decrement = useCallback(() => setCount(count => count - 1), [])
let increment = useCallback(() => setCount(count => count + 1), [])

That way the callbacks never have to change and the state updates will work better with concurrency