Getting error Cannot read property 'setState' of undefined
react-redux, reactjs
Solution
You should bind the `handleChange` function. You are getting this error because, in your handleChange function `this` keywork doesn't refer to the context of the React Class and hence you need to bind the function.
See this answer on `why do you need to bind event handlers in React`
class HTMLEditor extends React.Component {
constructor(props) {
super(props);
this.state = {value: 'Put here HTML'};
}
handleChange = (e) =>{
this.setState({value: e.currentTarget.value});
}
render() {
return (
<div>
<textarea defaultValue={this.state.value} onChange={ this.handleChange } />
<div>{this.state.value}</div>
</div>
);
}
}
ReactDOM.render(
<HTMLEditor />,
document.getElementById('container')
);
<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>
<div id="container"></div>
Problem
I'm new with Reactjs. I'm trying to do something very simple: update a div inside a render function when the user change the text inside text area. Any suggestions? ``` class HTMLEditor extends React.Component { constructor(props) { super(props); this.state = {value: 'Put here HTML'}; } handleChange(e) { this.setState({value: e.currentTarget.value}); } render() { return ( <div> <textarea defaultValue={this.state.value} onChange={ this.handleChange } /> <div>{this.state.value}</div> </div> ); } } ReactDOM.render( <HTMLEditor />, document.getElementById('container') ); ```