Javascript 即使添加event.prefeventDefault之后，React表单仍会刷新

有人能给我解释一下为什么我的react表单在提交后仍然刷新吗？我正在制作一个简单的待办事项列表来熟悉react，但我似乎无法找出这个bug。我想做的是在列表中添加一个任务，显示该列表。请查看此以查看我的代码，很抱歉格式设置不好

class TaskList extends React.Component {
 render() {
 var taskEntries = this.props.entries;

 function createTasks(task) {
  return <li key={task.key}>{task.text}</li>
 }

 var listTasks = taskEntries.map(createTasks);

 return (
   <ul>
     {listTasks}
   </ul>
   );
  }
}

class Task extends React.Component {
 constructor() {
 super();
 this.state = {
   tasks: [],
 };
 this.addTask = this.addTask.bind(this);
}

addTask(evt) {
 evt.preventDefault;
 var taskArray = this.state.tasks;

taskArray.push(
   {
    text: this.textInput.value,
    key: Date.now()
   }
);

this.setState({
  tasks: taskArray
});
}

render() {
return (
  <div>
    <form onSubmit={this.addTask}>
      <label htmlFor="title">Title of Task</label>
      <input type="text" ref={(input) => { this.textInput = input; }} />
      <label htmlFor="description">Description</label>
      <input type="submit"/>
    </form>
    <TaskList entries={this.state.tasks} />
  </div>
);
 }
}

var destination = document.querySelector(".container");

ReactDOM.render(
  <Task />,
  destination
);

类任务列表扩展了React.Component{
render（）{
var taskEntries=this.props.entries；
函数createTasks（任务）{
return
{task.text}
}
var listTasks=taskEntries.map（createTasks）；
返回(

{listTasks}

);
}
}
类任务扩展了React.Component{
构造函数（）{
超级（）；
此.state={
任务：[]，
};
this.addTask=this.addTask.bind（this）；
}
添加任务（evt）{
预防违约；
var taskArray=this.state.tasks；
taskArray.push(
{
text:this.textInput.value，
关键字：Date.now（）
}
);
这是我的国家({
任务：任务阵列
});
}
render（）{
返回(
任务名称
{this.textInput=input；}}/>
描述
);
}
}
var destination=document.querySelector（“.container”）；
ReactDOM.render(
,
目的地
);

您应该更改

evt.preventDefault

到

你应该改变

evt.preventDefault

到

---

他有一个；但最后；-）哦，天哪，那太尴尬了。谢谢！：）他有一个；但最后；-）哦，天哪，那太尴尬了。谢谢！：）