删除事件侦听器看不到类函数

Question

我有一个事件监听器来监听Escape press，此时我的模态将关闭；然而，由于某种原因，我收到了一个错误，即无法进行关闭函数调用。

Uncaught TypeError: this.closeModalFunc is not a function at checkEscape

我的班级：

checkEscape(pressed) {
if (pressed.key === 'Escape') {
this.closeModal();
}
}
componentWillMount() {
window.addEventListener('keydown', this.checkEscape);
}
componentWillUnmount() {
window.removeEventListener('keydown', this.checkEscape);
}
closeModal () {
// code to close modal
}

然而，我发现，如果我将checkEscape更改为函数常量，那么这个问题就会消失，一切都会按预期进行。

checkEscape = pressed => { /** the same innards */ };

当然，我很高兴我能做到这一点，但我想了解为什么会发生这种情况。。。

Answer 1

class组件要求您在构造函数中进行超级有趣的绑定，例如

this.checkEscape = this.checkEscape.bind(this);

箭头函数神奇地绑定到类auto。

如果这不意味着你想使用带钩子的功能组件，我不知道会是什么。：D