小编Mar*_*Duo的帖子

我正在学习React。在我正在编写的测试应用中，我使用onClick方法渲染了一些按钮。像这样渲染它们时，它们将按预期工作并在单击时调用selectMode函数。

constructor(props) {
    super(props);
    this.state = { mode: 'commits', commits: [], forks: [], pulls: [] };
}    
...
selectMode(mode) {
    this.setState({ mode });
}    

render() {
...
return (<div>                
        <button onClick={this.selectMode.bind(this, 'commits')}>Show Commits</button><br/>
        <button onClick={this.selectMode.bind(this, 'forks')}>Show Forks</button><br/>
        <button onClick={this.selectMode.bind(this, 'pulls')}>Show Pulls</button>
        </div>
        )
}

但是，当我尝试如下所示的建议的最佳实践方法时，通过在构造函数中进行绑定，在呈现组件时会多次调用selectMode函数。为什么然后调用onClick事件处理程序？我有什么问题？

constructor(props) {
    super(props);
    this.state = { mode: 'commits', commits: [], forks: [], pulls: [] };
    this.selectMode = this.selectMode.bind(this)
}
...
selectMode(mode) {
    this.setState({ mode });
}

render() {
...
return (<div>                
        <button onClick={this.selectMode('commits')}>Show Commits</button><br/>
        <button …