<div id="root"></div>
class Parent extends React.Component {
constructor(props) {
super(props);
this.state = {
value: 0
};
}
incrementValue() {
this.setState({ value: this.state.value + 1 });
}
render() {
return (
<div>
<Button handleClick={() => this.incrementValue()} />
<Display value={this.state.value} />
</div>
);
}
}
function Button(props) {
return <button onClick={props.handleClick}>Click me!</button>;
}
function Display(props) {
return <div>{props.value}</div>;
}
ReactDOM.render(<Parent />, document.getElementById("root"));
View Compiled
This Pen doesn't use any external CSS resources.