1.React 事件的命名采用小驼峰式(camelCase),而不是纯小写。
2.使用 JSX 语法时你需要传入一个函数作为事件处理函数,而不是一个字符串。
<button onClick={activateLasers}> Activate Lasers
</button>
3.阻止默认行为。你必须显式的使用 preventDefault
。
function ActionLink() {
function handleClick(e) { e.preventDefault(); console.log('The link was clicked.'); }
return (
<a href="#" onClick={handleClick}> Click me
</a>
);
}
4.类定义插件绑定事件方法
class LoggingButton extends React.Component {
// 此语法确保 `handleClick` 内的 `this` 已被绑定。 // 注意: 这是 *实验性* 语法。
handleClick = () => { console.log('this is:', this); }
render() {
return (
<button onClick={this.handleClick}>
Click me
</button>
);
}
}
传参方式
<button onClick={(e) => this.handleClick('参数', e)}>Delete Row</button>