我是React的新手，我正在尝试创建一个待办事项列表项目。我正在尝试通过输入将一个新任务添加到任务数组中，但当我按Enter键时，屏幕上没有添加任何内容。有人能帮忙吗？
App.js

import React, { Component } from "react";
import Tasks from "./Components/tasks";

class App extends Component {

    constructor(props) {
      super(props);

      this.state = {
          newTask: '',
          tasks: [
              { id: 1, text: "study" },
              { id: 2, text: "read" },
              { id: 3, text: "gym" },
          ]
      };
    }

    handleSubmit(e) {
      e.preventDefault();
      const tasks = [...this.state.tasks];
      tasks.push({id: 4, text: this.state.newTask});
      this.setState({ tasks: tasks });
    }

    handleChange= (e) => {
      this.setState({newTask: e.target.value});
    }

    render() {
        return (
            <div className="App">
                <h1>To Do List</h1>

                <form onSubmit={this.handleSubmit}>
                  <input type="text" placeholder="Enter task" value={this.state.newTask} onChange={this.handleChange}/>
                </form>

                <Tasks tasks={this.state.tasks} />
            </div>
        );
    }
}

export default App;

Adicionaly我在控制台上得到这个错误：error