未捕获的类型错误：e.preventDefault 不是函数答案

【问题标题】：Uncaught TypeError: e.preventDefault is not a function未捕获的类型错误：e.preventDefault 不是函数
【发布时间】：2019-01-22 07:32:48
【问题描述】：

我是 ReactJS 的新手，正在尝试根据教程创建一个简单的待办事项列表应用程序。这是 App.js 中的代码：

 addItem = e => {
    e.preventDefault();
    const newItem = this.state.currentItem;
    if (newItem.text !== "") {
      const items = [...this.state.items, newItem];
      this.setState({
        items: items,
        currentItem: { text: "", key: "" }
      });
    }
  };

它抛出：

未捕获的类型错误：e.preventDefault 不是函数在 App._this.addItem (App.js:89)

如果我尝试将其更改为 e.preventDefault 并将其绑定到构造函数中，错误就会消失，但表单仍会在提交时重新加载（即 preventDefault 不起作用）。有人可以帮我解决这个问题吗？

编辑添加 addItem 的调用方式：

这是我的 TodoList.js：

import React, {Component} from 'react'

class TodoList extends Component{
    componentDidUpdate(){
        if(this.props.inputElement.current){
       this.props.inputElement.current.focus();
        }
    }
    render(){
        return(
            <div className="todoListMain">
                <div className="header">
                    <form onSubmit={this.props.addItem}>
                        <input 
                            placeholder="Task" 
                            ref={this.props.addItem}
                            value={this.props.currentItem.text}
                            onChange={this.props.handleInput}
                        />
                        <button type="submit">Add Task</button>
                    </form>
                </div>
            </div>
        )
    }
}

export default TodoList;

【问题讨论】：

函数addItem是怎么调用的？
请edit你的问题告诉我们处理程序是如何安装在表单上的
编辑了帖子。谢谢

标签： javascript reactjs

【解决方案1】：

去掉input标签中的ref属性，就可以正常使用https://stackblitz.com/edit/react-womnwm

输入字段中的 ref 传递一个对象，其中包含一些关于标签的数据，其属性包括标签名称、属性、innerHTML 等，并且它没有 preventDefault 方法

【讨论】：

链接 [stackblitz.com/edit/react-womnwm] 已损坏。