受控组件

1. React是一个单向数据流

2.但可以自定义双向数据流组件（受控组件）

下面一个小例子:

 /*
  功能: 自定义组件, 功能如下
    1. 界面如页面所示
    2. 初始数据显示为atguigu
    3. 输入数据时, 下面的数据同步变化
  */

class TwoWay extends React.Component{
    constructor(props){
        super(props);
        this.state={
            msg:"zhangjing"
        }
        this.handleChange=this.handleChange.bind(this);
    }
    
    handleChange(event){
        let msg=event.target.value;
         this.setState({
            msg
         })
    }
    
    render(){
        return (
            <div>
                <input type="text" value={this.state.msg} onChange={this.handleChange} />
                <p>{this.state.msg}</p>
            </div>
        )
    }
}

ReactDOM.render(<TwoWay />,document.getElementById('example'));