onBlur（）和react-onclickoutside的onClickOutside（）之间的区别

Question

我正在尝试评估使用React's onBlur event和使用NPM react-onClickOutside之间的区别。

我需要能够在点击它之外时隐藏菜单，但如果React的onBlur事件已经具备它，则不希望有另一个依赖项。

Answer 1

您可以使用以下代码实现它，使用生命周期方法添加和删除文档的事件侦听器。

React.createClass({
 handleClick: function (e) {
    if (ReactDOM.findDOMNode(this).contains(e.target)) {
        return;
    }
 },

 componentWillMount: function () {
    document.addEventListener('click', this.handleClick, false);
 },

 componentWillUnmount: function () {
    document.removeEventListener('click', this.handleClick, false);
 }
});