受控组件

广义：react的组件渲染是否被调用者传递的props完全控制，控制则为受控组件，否则为非受控组件

狭义：主要是input输入框受控，代码如下：

class text extends Component {
  state = {
    username: "xiaowang"
  }
  render() {
    return (
      <div>
        <input type="text" value={this.state.username} onChange={(e) => {
          this.setState({
            username: e.target.value
          })
        }} />
        <button onClick={"可以直接通过this.state获取输入的数据"}>登录</button>
        <button onClick={this.setState({
            username: ""
          })
        }>重置</button>
      </div>
    );
  }
}

export default text;

input框内初始值由状态数据默认指定，框内输入数据会再次修改状态数据，并将输入的数据同步显示到输入框。