reactCounter.js

class Button extends React.Component {  
	render() {
  	return (
  		<button onClick={() => this.props.onClickFunction(this.props.incrementValue)}>
      	+{this.props.incrementValue}
      </button>
  	);
  }
};

const Result = (props) => {
	return (
  	<div>{props.counter}</div>
  );
};

class App extends React.Component {
	constructor(props) {
  	super(props);
    this.state = { counter: 0 };
  }
  incrementCounter = (incrementValue) => {
    	this.setState((prevState) => ({
      	counter: prevState.counter + incrementValue
    }));
  }
  resetCounter = () => {
  		this.setState(({
      	counter: 0
      }));
  }
  
	render() {
  	return (
    	<div>
      	<Button incrementValue={1} onClickFunction={this.incrementCounter} />
        <Button incrementValue={5} onClickFunction={this.incrementCounter} />
        <Button incrementValue={"Reset"} onClickFunction={this.resetCounter} />
        <Result counter={this.state.counter}/>
      </div>
    )
  }
}

ReactDOM.render(<App />, mountNode)