App.jsx

44 lines | 1.011 kB Blame History Raw Download

class App extends React.Component {

    constructor(props) {
        super(props);
        console.log('App start');

        this.state = { counter: 0 };

        //Прикрепление текущего объекта к this в функции обработки
        this.OnClick_Minus = this.OnClick_Minus.bind(this);
        this.OnClick_Plus = this.OnClick_Plus.bind(this);
    }

    OnClick_Minus()
    {
        this.setState({ counter: this.state.counter - 1 });
    }

    OnClick_Plus(e)
    {
        this.setState({ counter: this.state.counter + 1 });
    }


    render() {
        return (
            <div>
                <h1>Hello, React 2+2 = {2 + 2}</h1> <br />

                <p>Counter: {this.state.counter} </p>

                <button onClick={this.OnClick_Minus}>Counter--</button>
                <button onClick={this.OnClick_Plus}>Counter++</button>

                <Component2 /><br />
            </div>
        );
    }
}
ReactDOM.render(
    <App />,
    document.getElementById("app")
)