Javascript 当点击项目时，可以'；不要这样做

当我点击某个人时，我的表单有不同的输入（示例如下），如果另一个输入打开，我想关闭它们

也许有人会说我的错误在哪里？ 谢谢

我的代码外观：

class SignUp extends Component {
    constructor() {
      super();
      this.state = {
        selectedCode: false,
      };
    }
    componentDidMount() {
      document.addEventListener("click", this.handleClickOutside);
    }
    componentWillUnmount() {
      document.removeEventListener("click", this.handleClickOutside);
    }
    handleClickOutside(e) {
      if (e.target.id !== "code") {
        this.setState({
          selectedCode: false // here is an error
        });
      } else {
        console.log("YES CODE");
      }
    }
render (){
  return (
    <form >
      <input .../> 
      <input id="code" .../>
    </form>
}

类注册扩展组件{
构造函数（）{
超级（）；
此.state={
selectedCode:false，
};
}
componentDidMount（）{
document.addEventListener（“单击”，此.handleClickOutside）；
}
组件将卸载（）{
document.removeEventListener（“单击”，this.handleClickOutside）；
}
外把手（e）{
如果（例如target.id！=“代码”）{
这是我的国家({
selectedCode:false//这是一个错误
});
}否则{
控制台日志（“是代码”）；
}
}
渲染（）{
返回(
}

试试这个

document.addEventListener("click", this.handleClickOutside.bind(this));

---

浏览器控制台中是否显示任何错误？您需要将

this

绑定到事件处理程序。通常的做法是在构造函数中使用

bind

：

this.handleClickOutside=this.handleClickOutside.bind（this）；

有关详细信息，请参阅链接问题的答案。（有时人们使用箭头函数，但在原型上使用该方法在测试框架中效果更好。）