Deep props merging functionality for React.
Merging react component props by the following rule:
- Normal props replace the former
children
are ignoredclassName
are concatenatedstyle
are shallow merged- functions that have initial
on
are run in sequence from left to right
When creating extensible react components, this is what we need.
The first argument is mutated for performance reason. If you don't want this behavior, please pass the first argument as an empty object.
Install this package with npm
.
npm i react-merge-props -s
This package is very useful when creating wrapping components. For example:
import React from 'react';
import mergeProps from 'react-merge-props';
const HeadingOne = (props) => (
<h1 {...mergeProps({ style: { 'color': 'red' }}, props)}>{props.children}</h1>
);
export default HeadingOne;
MIT © Zhang Kai Yu