components-props-state.js

import React from 'react';
import ReactDOM from 'react-dom';

class MyButton extends React.Component {
    render() {
        return <button 
        onClick={() => { this.props.handleClick(this.props.label); }}>{this.props.label}</button>
    }
}

class MyLabel extends React.Component {
    render() {
        return <div>Botão clicado:{this.props.text}</div>
    }
}

class App extends React.Component {
    constructor(props) {
        super(props)

        this.state = {
            labelText: '',
        };
    }

    setLabelText = (labelText) => {
        this.setState({ labelText });
    }

    render() {
        return (
            <div className="App">
            <MyLabel text={this.state.labelText} />
            <MyButton handleClick={this.setLabelText} label="Botao 1" />
            <MyButton handleClick={this.setLabelText} label="Botao 2" />
            <MyButton handleClick={this.setLabelText} label="Botao 3" />
            <MyButton handleClick={this.setLabelText} label="Botao 4" />
            </div>
        );
    }
}

ReactDOM.render (
    <App />,
    document.querySelector('#root')
);