react受控组件和非受控组件

React组件的数据渲染是否被调用者传递的props完全控制，控制则为受控组件，否则非受控组件。

import React, { Component, createRef } from 'react'

export default class App extends Component {
    constructor (props) {
        super(props)
        this.ipt = createRef()
    }
    state = {
        textValue: '',
    }
    handChange (e) {
        this.setState({
            textValue: e.target.value
        })
    }
    render() {
        return (
            <div>
                {/* 受控组件   完全控制 */}
                {/* <input type="text" value={this.state.textValue} onChange={this.handChange.bind(this)} /> */}

                {/* 非受控组件 */}
                <input type="text" ref={this.ipt} onInput={this.handChange.bind(this)} /> 
            </div>
        )
    }

    componentDidMount () {
        setTimeout(()=> {
            console.log(this.state.textValue);
        },5000)
    }
}