React---受控组件（Controlled Component）

特性：
Define和initial 通过组件的 state property
Update 只能通过setState()
在 HTML 中，表单元素（如、 和 ）之类的表单元素通常自己维护 state，并根据用户输入进行更新。而在React中，使用的是state来渲染，维护以及更新，所以被React 以这样方式控制取值的表单元素称之为受控组件。
例如下面所示的代码
value的属性是由this.state.controlledName来显示的，更新是由click事件onChange 的handleChange通过setState（）来完成。

<input name='controlledName' type='text' value={this.state.controlledName} onChange={this.handleChange} />
  handleChange(e) {
        const target = e.target;
        const value = target.type === 'checkbox' ? target.checked : target.value;
        const name = target.name;
        this.setState({
            [name]: value
        })
    }

下面是在一个组件中使用多个表单元素的例子，需要注意的是：
state的属性不能和表单元素中标签的属性重复定义，不然获取不到值。

import React from 'react';
class Co