javascript - 解除绑定(bind)点击react

Question

我有一个问题。如何解除react中元素的点击绑定(bind)？我有按钮，当我点击它时，它会增加分数+1，点击后我想删除它。我怎样才能做到这一点？

请帮帮我!

class Toggle extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      result: 2,
      score: 0
    };
    
    this.getRes = this.getRes.bind(this);
  }
  

 
  
  getRes() {
    if (this.state.result == 2) {
      this.setState({score: this.state.score+1})
      
      this.getRes.unbind(this);
      
    }
  }

  render() {
    return (
      <div>
      <div style={{paddingTop: 10}}>
        <p>
        <button>1</button>
        <button onClick={this.getRes}>{this.state.result}</button>
        </p>
        
          <p>
        <button>1</button>
        <button onClick={this.getRes}>{this.state.result}</button>
        </p>
        
        
        <p>{this.state.score}</p>
        
        </div>
        </div>
    );
  }
}

ReactDOM.render(
  <Toggle />,
  document.getElementById('root')
);

Answer 1

在 React 中，您可以通过使用 render() 描述新状态来更改 UI，而不是通过手动绑定(bind)或取消绑定(bind)或更改内容。

如果您希望处理程序通过绑定(bind)，请将您的 render() 方法更改为仅将 this.getRes 传递给 onClick:

onClick={... ? this.getRes : null}