事件处理

传统HTML：

　　<button onclick = "f1()">

　　　　Activate Lasers

　　</button>

React：

　　<button onclick = {f1()}>

　　　　Activate Lasers

　　</button>

 

绑定this：==> onClick = {this.handleClick}        Create React App 默认启用此语法。

　　public class fields 语法：

　　　　handleClick = () => {

　　　　　　console.log('this is:', this);

　　　　}

　　回调中使用箭头函数：

　　　　return (

　　　　　　<button onClick = {() => this.handleClick()}>

　　　　　　　　Click me

　　　　　　</button>

　　　　) 

此语法问题在于每次渲染 LoggingButton 时都会创建不同的回调函数。

在大多数情况下，这没什么问题，但如果该回调函数作为 prop 传入子组件时，

这些组件可能会进行额外的重新渲染。我们通常建议在构造器中绑定或使用 class fields 语法来避免这类性能问题。