Managing State Help

I feel like I’m super close, but there is something Im missing that I can’t seem to find. Any thoughts?

Your code so far


class DisplayMessages extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      input: '',
      messages: []
    }
    this.handleChange = this.handleChange.bind(this);
    this.submitMessage = this.submitMessage.bind(this);
  }
  // add handleChange() and submitMessage() methods here
  handleChange(e) {
    this.setState({input: e.target.value});
  }

  submitMessage() {
    let newMessages = [...this.state.messages, this.state.input];
    this.setState({
      messages: newMessages,
      input: ''
    });
  }

  render() {
    return (
      <div>
        <h2>Type in a new Message:</h2>
        { /* render an input, button, and ul here */ }
        <input value={this.state.input} onChange={this.handleChange} />
        <button onSubmit={this.submitMessage}>Add Message</button>
        <ul>
        {this.state.messages.map(msg => <li>{msg}</li>)}
        </ul>
        { /* change code above this line */ }
      </div>
    );
  }
};

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3578.98 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/front-end-libraries/react-and-redux/manage-state-locally-first

There is no such button method as onSubmit. There is one called onClick.

Ugh, thank you! Thats one of the hardest things I’m finding about learning new packages, is keeping track of info I already know. Thank you!