1. 通过onXxx属性指定事件处理函数(注意大小写)

          a. React使用的是自定义(合成)事件，而不是使用的原生DOM事件 --- 为了更好的兼容性

          b. React中的事件是通过事件委托方式处理的(委托给组件最外层的元素)冒泡原理(高效)

2.  通过event.target得到发生事件的DOM元素对象

             event.target发生事件的事件源(即事件是在谁身上发生的)

             发生事件的元素正好是我们要操作的元素（如下右侧输入框）, 所以，请勿过渡使用refs(因为很多时候可以省掉使用，可以通过event.targer得到)

  class Demo extends React.Component{
                state = {name:"小明"}
                //创建Ref容器
                myRef = React.createRef()
                myRef2 = React.createRef()
                //展示左册输入框的内容
                showData = ()=>{
                    console.log(this.myRef.current.value);
                }
                showData2 = (event)=>{
                    let source = event.target
                        console.log(source);
                        console.log(source.value);
                }
                showData3(name){
                    console.log(name);
                }
                render(){
                    return (
                        <div>
                            <input ref={this.myRef} type='text' />
                            <button onClick = {this.showData}>点击显示左边输入框的内容</button>
                            <input type="text" onBlur={this.showData2}/>
                            <button onClick = {this.showData3.bind(this,this.state.name)}>绑定this传递参数</button>
                        </div>
                    )
                }
            }
ReactDOM.render(<Demo/>,document.getElementById("test"));