react中的jsx语法有一个onclick事件，可以直接执行setstate方法吗？

Question

突然想问一个问题，能不能在react的render-return中，返回一个标签的onclick方法中直接执行this.setState方法？
因为看到大部分都是现在外部声明一个函数，然后在onclick中调用，所以很好奇，能不能实现？

声明：
close: function() {
    this.setState({active : false})
}



render-return：

<div id="close-search" onClick={this.close}></div>

想直接实现
<div id="close-search" onClick={this.setState({active : false})}></div>
类似这种的实现。

Answer 1

当然可以啊，花括号里就是js。随便你怎么写，只是这样写很不友好。逻辑控制应该提取出来。

class App extends React.Component{

  constructor(){
    super();
    this.state = {
      var : 6666
    }
  }
  
  render(){
    return <div onClick={()=>{this.setState({var:3333})}}>{this.state.var}</div>
  }
}

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

Answer 2

<div id="close-search" onClick={(e)=>{this.setState({active:false})}}></div>

Answer 3

<div id="close-search" onClick={()=> this.setState({active : false})}></div>

Answer 4

直接像题主这样写貌似在解析到这个div的时候就会立即执行，而不是点击后执行。需要用下面两位答主那样用匿名函数，或者用bind
不确定，待大神指点