在 React 事件处理程序中使用 .bind() 时出错答案

【问题标题】：Error using .bind() in React event handler在 React 事件处理程序中使用 .bind() 时出错
【发布时间】：2017-06-23 23:41:25
【问题描述】：

我正在学习 React 教程，但无法理解我为什么会遇到错误。

我正在尝试使用 React 添加此按钮元素：

<button onClick={this.add.bind(null, 'new item')}>New Item</button>

事件处理程序应该调用位于不同 React 类中的以下函数：

    add: function(item) {
    var arr = this.state.comments;
    arr.push(item);
    this.setState({comments: arr});
    },

我被告知这不起作用，因为我“将 null 绑定到你的函数这个值，并且在你正在访问的函数内部，你正在从 this 访问属性，这会导致 typeError（可能：无法访问 null 或 sh 的属性状态。）”

但是，我不知道这意味着什么或如何解决问题。请帮忙。

下面是我完整的 codepen 项目和我正在使用的 YouTube 教程（React JS 初学者教程 - 13 - TheNewBoston 创建新组件）的链接。

提前非常感谢您。这是我在 StackOverflow 上的第一个问题，我正在尝试接受基于该项目的学徒计划。非常感谢任何反馈，我是个大男孩，所以我可以处理批评。

-丹

【问题讨论】：

【解决方案1】：

错误消息Uncaught TypeError: Cannot read property 'bind' of undefined 表示您在undefined 对象上调用bind。 IE。 this.add 是 undefined。

为什么this.add 未定义？

因为您没有在Board 组件中定义add 函数。将add 函数从Comment 组件移动到Board 组件。

（将 Javascript 代码的第 15-19 行移动到 Board 组件中。）

【讨论】：