handlesubmit is not a function grocery list

  //fetch data from server
  handleData = () => {
    fetch('http://localhost:5000/api/listitems')
       .then(response => response.json())
       .then(data => this.setState({ items: data }));
  }

  //call handleData() on page load
  componentDidMount() {
    this.handleData();
  }

  //this function fires when form is submited
  handleSubmit(event) {
    event.preventDefault();
    fetch('http://localhost:5000/api/listitems', {
      method: 'POST',
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json'
      },
     body: JSON.stringify( {
        Content: this.state.content,
        List_Group: this.state.listgroup,
        Date_Added: this.state.date
      })
    })
    .then(res => res.json())
    .then(() => this.setState({content: ''}))
    //call handleData() when form is submited, which reloads list
    .then(() => this.handleData())
    .then(console.log(this.state.items))
    .catch(err => console.log(err));
  }