React.js изменение state

Question

Не могу разобраться с работой setState() у React.js. При обработке события выбрасывает ошибку setState is not a function Привожу пример кода. Работаю с версией 16.

class Test extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            message: 'nothing'
        }
    }
changeText() {
    this.setState({
        message: 'new text'
    });
}

render() {
    return (
        <div className={'container'}>
            <h2 onClick={this.changeText}>Click me!</h2>
            <p>{this.state.message}</p>
        </div>
    );
}

}
ReactDOM.render(<Test/>, document.getElementById('root'));

<div id="root"></div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

Answer 1

Проблема в том, что форма объявления функции changeText() {... теряет контекст. Нужно либо использовать arrow function - changeText = () => {..., либо привязывать контекст к функции в вызове {this.changeText.bind(this)}