class Parent extends React.Component{
constructor(){
super();
this.state={co:"red"}
}
render(){
return(
<Child color={this.state.co}></Child>
)
}
}
class Child extends React.Component{
constructor(props){
super(props);
}
render(){
return(
<Div style = {{color: this.props.color}}> I subassembly, want to red </ div>
)
}
}
ReactDOM.render(
<Parent />,
document.getElementById('box')
);
only an internal state change state, props and can be connected to external data fetch, so outgoing state value defined in the sub-assembly, with the received value within parent components this.props.color
The results as shown below:
