Invokes a callback on prop change as a HOC for React and React Native


1,788160.3.12 years ago4 years agoMinified + gzip package size for @hocs/with-callback-on-change in KB


:bell: with-callback-on-change

npm ci coverage deps

Part of a collection of Higher-Order Components for React, especially useful with Recompose.

Invokes a callback on prop change, useful to decouple side effects like onChange handler in a declarative way.


yarn add @hocs/with-callback-on-change


  propName: string,
  callback: (props: Object) => void
): HigherOrderComponent
import React from 'react';
import { compose, withState, withHandlers } from 'recompose';
import withCallbackOnChange from '@hocs/with-callback-on-change';

const Demo = ({ count, onButtonClick }) => (
    <button onClick={onButtonClick}>increment</button>

export default compose(
  withState('count', 'setCount', 0),
    onButtonClick: ({ setCount, count }) => () => setCount(count + 1)
  withCallbackOnChange('count', ({ count }) => console.log(count))

:tv: Check out live demo.

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.