In the docs there is an example for withState like this:
const addCounting = compose(
withState('counter', 'setCounter', 0),
withProps(({ setCounter }) => ({
increment: () => setCounter(n => n + 1),
decrement: () => setCounter(n => n - 1),
reset: () => setCounter(0)
}))
)
I'm curious if there is any advantage to rewriting it like so:
const addCounting = compose(
withState('counter', 'setCounter', 0),
withHandlers({
increment: ({ setCounter }) => () => setCounter(n => n + 1),
decrement: ({ setCounter }) => () => setCounter(n => n - 1),
reset: ({ setCounter }) => () => setCounter(0)
})
)
withProps will create new functions every time when it get updated; on the other hand, withHandlers won't create new functions.
withHandlers is useful when you want to pass these functions to other components which shouldComponents are implemented by comparing props shallowly (like how recompose/pure do).
Thanks for the explanation.
Most helpful comment
withPropswill create new functions every time when it get updated; on the other hand,withHandlerswon't create new functions.withHandlersis useful when you want to pass these functions to other components whichshouldComponents are implemented by comparing props shallowly (like howrecompose/puredo).