Question

我试图解除ES6反应组件中的事件侦听器的绑定。我不确定这是否是最佳方法。

export default class ProductDetail extends React.Component {
    ...
    componentDidMount() {
        this.boundKeyListener = this.keyListener.bind(this);
        document.addEventListener('keydown', this.boundKeyListener);
    }

    componentWillUnmount(){
        document.removeEventListener('keydown', this.boundKeyListener);
    }
    ...
}

在this.keylistener内部我需要做一个this.setState({foo:'bar'})，我发现在类的范围内运行监听器的唯一方法是使用fn.bind()。

我的问题是，我真的需要将boundListener保存到属性吗？或者

document.removeEventListener('keydown', this.keyListener.bind(this));

足够吗？

Answer 1

或者

document.removeEventListener('keydown', this.keyListener.bind(this));

足够吗？

不，不会。 .bind会返回新函数，因此您将尝试删除与您添加的处理程序不同的处理程序。

function foo() {}

console.log(foo.bind(null) === foo.bind(null));

ReactJS删除ES6中的绑定事件处理程序

1 个答案: