react-props-diff-logger
v0.1.0
Published
Helps you debug React components by logging props changes
Downloads
2
Readme
Installation
npm install -D react-props-diff-logger
yarn add --dev react-props-diff-logger
pnpm add -D react-props-diff-logger
Usage
Basic Usage
Wrap your component with withPropsDiffLogger
HOC:
import { PropsDiffLogger } from 'react-props-diff-logger';
import { MyComponent as _MyComponent } from '../../components/my-component';
const MyComponent = withPropsDiffLogger(_MyComponent);
function App() {
return (
// ...
<MyComponent />
// ...
);
}
Usage with Memoized Components
If you have a memoized component, you should wrap withPropsDiffLogger
with memo
in the same way:
const MyComponent = memo(withPropsDiffLogger(_MyComponent), /*arePropsEqual?*/);
Name
By default, the function's name or displayName
is used. To set or override the component's name, provide the second
name
argument:
const MyComponent = withPropsDiffLogger(_MyComponent, 'MyCustomName');