Tell us what’s happening:
Can’t use this.setState
// running test
Cannot read property ‘setState’ of undefined
Cannot read property ‘setState’ of undefined
Cannot read property ‘setState’ of undefined
Cannot read property ‘setState’ of undefined
The DisplayMessages component should render a div containing an h2 element, a button element, a ul element, and li elements as children.
// tests completed
Your code so far
class DisplayMessages extends React.Component {
constructor(props) {
super(props);
this.state = {
input: '',
messages: []
}
}
// add handleChange() and submitMessage() methods here
handleChange(e) {
this.setState(() => ({ input: e.target.value }))
}
submitMessage() {
this.setState(({messages, input}) => ({
input: "",
messages: [...messages, input]
}))
}
render() {
return (
<div>
<h2>Type in a new Message:</h2>
{ /* render an input, button, and ul here */ }
<input onChange={this.handleChange} value={this.state.input}/>
{ /* change code above this line */ }
</div>
);
}
};
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/68.0.3440.106 Safari/537.36
.
Link to the challenge: