用参数响应onclick-pass事件

Question

function clickMe(e){
  //e is the event
}

<button onClick={this.clickMe}></button>

function clickMe(parameter){
  //how to get the "e" ?
}
<button onClick={() => this.clickMe(someparameter)}></button>

我想获取事件。我怎样才能得到它？

Answer 1

解决方案1

function clickMe(parameter, event){
}

<button onClick={(event) => {this.clickMe(someparameter, event)}></button>

解决方案2在解决方案1中，使用绑定函数被认为比箭头函数更好。注意，事件参数应该是处理函数中的最后一个参数

function clickMe(parameter, event){
}

<button onClick={this.clickMe.bind(this, someParameter)}></button>

Answer 2

有了ES6，你可以像这样用更短的方式：

const clickMe = (parameter) => (event) => {
    // Do something
}

并使用它：

<button onClick={clickMe(someParameter)} />

Answer 3

试试这个：

<button 
   onClick={(e) => {
      this.clickMe(e, someParameter);
   }}
>
Click Me!
</button>

在你的职能中：

function clickMe(event, someParameter){
     //do with event
}