1. Nenhum outro parâmetro
return <a href="https://imooc.com/" onClick={this.clickHandler}>
click me
</a>
//当我们没有传任何参数的时候还是可以使用event，即默认追加了一个event参数
clickHandler = (event) => {
event.preventDefault() // 阻止默认行为
event.stopPropagation() // 阻止冒泡
}2. Passe o evento e outros parâmetros ao mesmo tempo
// 最后追加一个参数，即可接收 event
clickHandler(id, title, event) {
console.log(id, title) // 2 "按钮"
console.log('event', event) //event Class {…}
}
render(){
return(
<button onClick={this.clickHandler.bind(this,2, '按钮')}>点我</button>
)
}A captura de tela da saída do console é a seguinte:
3. A diferença entre os dois métodos de parâmetros de passagem de função de seta e parâmetros de passagem de ligação
<button onClick = { (e)=> this.handleClick( id,e ) }></button>
<button onClick = { this.handleClick.bind( this,id ) }></button>
Os dois métodos acima são equivalentes 箭头函数 e Function.prototype.bind são implementados por e respectivamente .
Nos dois casos acima, o objeto de evento React e será passado como o segundo parâmetro.
Se a função de seta for usada, o objeto de evento deve ser passado explicitamente,
A bind propósito, o objeto de evento e mais parâmetros serão passados implicitamente.
Você pode ver outro artigo meu para comparar parâmetros de transferência js nativos