React TypeError:Cannot read property 'text' of undefined

Question

I am working on some project but I really stuck on this problem. Why I get this error like TypeError: Cannot read property 'text' of undefined, when my program update state onChange but when I clicked on submit button I get this mess, Please help me out.

my code snippet:

import React, { Component } from "react";
import { Form, Button, Input, Label } from "semantic-ui-react";

class FormField extends Component {
  constructor() {
    super();
    this.state = {};
  }

  handleChange = event => {
    this.setState({ [event.target.name]: event.target.value });
  };

  handleSubmit(event) {
    event.preventDefault();
    const { text } = this.state;
    console.log(text);
  }

  textToCode() {}

  render() {
    return (
      <Form onSubmit={this.handleSubmit}>
        <Form.Field>
          <Label>Enter Text</Label>
          <Input
            name="text"
            value={this.state.text}
            onChange={this.handleChange}
          />
        </Form.Field>

        <Form.Field>
          <Button
            type="submit"
          >
            Submit
          </Button>
        </Form.Field>

        <Form.Field>
          <input disabled />
        </Form.Field>
      </Form>
    );
  }
}

export default FormField;

Answer 1

handlesubmit isn't being passed properly to the event handler. You can write () => this.handlesubmit() in stead.