score:1

Accepted answer

we use props to pass the data from the parent's state to the children (there's no need to bind states of parent and child, or use refs, or attempt to involve life-cycle methods):

const { render } = reactdom

class component2 extends react.component {
    render(){
        return (
          <div>
            enabled: {this.props.isenabled ? 'true' : 'false'}
          </div>
        )
    }
}

class othercomponent extends react.component {
  render(){
    return <div style={{backgroundcolor:'black', color:'white', width:100}}>{this.props.children}</div>
  }
}

class component1 extends react.component {
    constructor(props) {
        super(props)
        this.selector = this.selector.bind(this)
        this.state = {
            enable: false
        }
    }
        

    selector() {
        this.setstate({
            enable: true
        })
    }

    render() {
        return ( 
            <div>
                <select onchange={this.selector}><option /><option>enable</option></select>
                <othercomponent>
                  <component2 isenabled={this.state.enable} />  
                </othercomponent>
            </div>
        )
    }
}
    
render (
  <component1 />,
  document.getelementbyid('root')
)
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.12.0/umd/react.production.min.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.11.0/umd/react-dom.production.min.js"></script><div id="root"></div>


Related Query

More Query from same tag