CODEWITHSUNDEEP
javascriptreactjs
madmanul
madmanul

Reputation: 420

How to change react component's child property

I have react component with a number of various children: 

render() {
    let Tag = '${this.props.wrapper}';
    return (
        <Tag>
            {this.props.children}
        </Tag>
    );
}

When some event occured i need to change className property of a number of children. Is there any way to do this from parent component?

Upvotes: 0

Views: 117

Answers (2)

amann
amann

Reputation: 5902

I think you're looking for something like this:

render() {
  return React.createElement(
    this.props.wrapper,
    null,

    // Children
    React.cloneElement(
      this.props.children,
      {className: 'assignedChildClassname'}
    )
  );
}

Does this solve your problem?

Upvotes: 1

Piyush.kapoor
Piyush.kapoor

Reputation: 6803

In your parent component, you can pass classNames as props

<Child className={this.state.classes}/>

Your parent state will have classes that would be changed on click

Upvotes: 0

Related Questions