Question

这是点击之前的初始状态。

this.state = {
      isNavOpen: false
};

这是切换器，它应该可以正常工作

 toggleNav() {
    this.setState({
      isNavOpen: !this.state.isNavOpen
    });
  }

此导航栏我想在其模糊时关闭，但不知道为什么我会出错。

onBlur(e) {
         var currentTarget = e.currentTarget;
         setTimeout(function() {
           if (!currentTarget.contains(document.activeElement)) {
             this.setState({
               isNavOpen: this.state.isNavOpen
             });
           }
         }, 0);
       }

这是我要在单击链接时启用模糊的元素

<NavbarToggler onClick={this.toggleNav} tabIndex="1" onBlur={this.onBlur} />
<Collapse isOpen={this.state.isNavOpen} navbar>

Answer 1

根据您的错误描述和代码，您似乎缺少bind的{{1}}。尝试：

setTimeout

Answer 2

感谢Ramiz解决方案，该解决方案消除了错误，但模糊效果不起作用，所以我将其更改为：

  onBlur(e) {
       var currentTarget = e.currentTarget;
       setTimeout(function() {
         if (!currentTarget.contains(document.activeElement)) {
           this.setState({
             isNavOpen: !this.state.isNavOpen
           });
         }
       }.bind(this), 0);
    }

此“ isNavOpen：！this.state.isNavOpen”

Reactjs onBlur-导航栏

2 个答案: