React - Create a Controlled Form

So, both my code and answer code show the same error on FCC console when clicking the submit button.

Uncaught TypeError: Cannot read properties of null (reading 'match')

The code itself:

class MyForm extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      input: '',
      submit: ''
    };
    this.handleChange = this.handleChange.bind(this);
    this.handleSubmit = this.handleSubmit.bind(this);
  }
  handleChange(event) {
    this.setState({
      input: event.target.value
    });
  }
  handleSubmit(event) {
    event.preventDefault()
    this.setState({
      submit: this.state.input
    });
  }
  render() {
    return (
      <div>
        <form onSubmit={this.handleSubmit}>
          <input
            value={this.state.input}
            onChange={this.handleChange} />
          <button type='submit'>Submit!</button>
        </form>
        <h1>{this.state.submit}</h1>
      </div>
    );
  }
};

Your browser information:

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

Challenge: React - Create a Controlled Form

Link to the challenge:

1 Like

Hi @pinheirogui

Your code is correct, it pass. Try to copy, reset the challenge and past it. Or just try again later on.

Good luck and happy coding!

ya,i have see his code and it works.i think he asked to know or understand the error shown on the console and also i do not understand it either.