Question

我正在使用React和Redux。我有个问题。我知道当我在一个函数中需要“this”时我应该bind它。但没有绑定我的代码工作。为什么？功能：

onSubmit() {
    this.props.dispatch({type: 'ADD_TO_LIST', payload: this.state.inputValue});
}

这是我的渲染输入：

<input type="text" placeholder="Enter Your Text ..." onChange={(e) => {
this.setState({inputValue: e.target.value})}} onKeyDown={(e) => {
if (e.key === 'Enter') {
    this.onSubmit()
}
}}/>

Answer 1

你知道＆＃34;当需要绑定时＃34;但是你错过了一件事，＆＃34;调用函数会有这个（调用它的对象）＆＃34;。 false的值取决于函数的调用方式。

下面：

this

您正在使用this.onSubmit()（类实例）调用submit，因此this（内部提交）将引用类实例。

检查这些参考文献：

MDN Doc

Why is JavaScript bind() necessary?

Answer 2

因为您使用了箭头函数来调用它，所以它不是事件处理程序本身。箭头功能已正确绑定。

Answer 3

虽然function具有约束力（它更改为this），但ES6箭头函数为non-binding。一个例子：

this.a = 1;

obj = {
  a: 2,
  bfunction: function() { return this.a; },
  barrow: () => { return this.a; },
}

console.log(obj.bfunction()) // 2
console.log(obj.barrow()) // 1

为什么函数在没有“this”绑定的情

3 个答案: