score:15

Accepted answer

best way to add new props or override existing ones is to map your children props and clone each element using react.cloneelement.

nice article to read about react children.

react.children.map(this.props.children, child =>
    react.cloneelement(child, { newprop: 'value', existingprop: 'value' }));

you could also use children as a function. this way u can also add your props.

example:

// root component
const parent = () => { 
  const onclose = () => console.log('i am on close prop');

  // pass onclose to children
  return <mycomponent>{ children(onclose) }</mycomponent>
}

// mycomponent
const mycomponent = () => {
// pass onclose to children
  return (
    <div>
      {/* children below */}
      {(onclose) => (
          <formcomponent
              mynewprop={onclose}
          />
      )}
    </div>
);

}

Related Query

More Query from same tag