Mehrdad Mehrdad - 2 months ago 17
React JSX Question

Set props on react class

I'm using a third party component.

I have two classes named

Parent
and
Child
. In
Parent
component I use that third party component which accepts a class name as a prop and renders in itself.

So the parent component looks like this:

render(){
return (
<div className="section">
<Select
placeholder={placeholder}
valueComponent={Child}
/>
</div>
);


What I want to do is to pass some props to Child component, but I've always done this like
<Child someProp="prop"/>
.

Is there any way to pass props to
Child
component in this manner?

Answer

I don't know if the Select library provides a way to do that. In case, you could always use a wrapper component:

// Create a child wrapper component and pass it to Select.
function ChildWrapper(props) {
  return <Child {...props} someProp="prop" />;
}

render(){
  return (
    <div className="section">
      <Select
        placeholder={placeholder}
        valueComponent={ChildWrapper}
      />
    </div>
  );
}