React.js 提供了一系列的 on* 方法即可直接用来做事件监听。
如:
class Button extends Component {
handleClickOnButton (param, e) {
console.log(this, word)
}
render () {
return (
<h1 onClick={this.handleClickOnTitle.bind(this, 'Hello')}>React 小书</h1>
)
}
}
注意事项:
- 事件绑定时是以on*加事件名的驼峰命名法
- 该方式不做特殊处理的话只能用在原生的html标签上而不能用作在组件上绑定事件
- 事件函数内的this默认是undefined,如想指向当前React实例,需在绑定事件时绑定this或在构造函数中统一绑定也行。
- React.js 会给每个事件监听传入一个 event 对象,这个对象提供的功能和浏览器提供的功能一致,而且它是兼容所有浏览器的。
- 事件需要传参也得使用bind绑定,传多个参数的话最好整合到一个对象或数组里,因为事件函数定义时默认最后一个参数是事件对象,如果绑定时传入多个参数,会将其覆盖掉
网友评论