React学习05----事件对象event，拿到input输入框的值，类似Vue的双向数据绑定

项目结构：

事件对象:
在触发DOM上的某个事件时,会产生一个事件对象event。这个对象中包含着所 有与事件有关的信息
常用信息有dom节点，dom属性

例子：Home.js

import React from 'react';

/**
 * 事件对象:在触发DOM上的某个事件时,会产生一个事件对象event。这个对象中包含着所有与事件有关的信息
 * 常用信息有dom节点，dom属性
 */

class Home extends  React.Component{

    constructor(props){
        super(props);
        this.state={
            name:"zhh",
            msg:"所有信息",
        }
    }
    // 事件对象:在触发DOM上的某个事件时,会产生一个事件对象event。这个对象中包含着所有与事件有关的信息
    getData=(event)=>{
        // alert(this.state.msg);

        // event对象中包含着所有与事件有关的信息
        // console.log(event);

        // 获取执行事件的dom节点
        // alert(event.target);

        // 获取dom节点（button对象），设置背景颜色，是红色
        event.target.style.background='red';

        //获取dom的属性（获取 button 的 aid 属性）
        alert(event.target.getAttribute('aid'))



    }
    render() {
        return(
            <div>
                {this.state.name}
                <br/>
                <button aid="123" onClick={this.getData}>事件对象</button>
            </div>

        );

    }