React.js 官方文档摘记：非受控组件

非受控组件

原来我们使用state来保存表单的输入，所以每一个组件都要写一个处理函数：表单，所以对把项目从js迁移到react.js比较麻烦，所以可以使用下面的形式，来构建非受控组件。

class UncontrollerComponent extends React.Component{
    handleSubmit=()=>{
        alert(this.input.value);
    }
    render(){
        return(
            <div>
                <form onSubmit={this.handleSubmit}>
                    <input yupe='text' ref={(input)=>this.input=input} />
                    <input type='submit' value='提交按钮' />
                </form>
            </div>
        );
    }
}

其中重点的话是：<input type='text' ref={(input)=>this.input=input}>，我把上面的返回JSX展示出来结果就是：

React.createElement(
    "input", { 
        type: "text",
        ref: function ref(input) {
            return this.input = input;
        } 
    }
)

上面的结果显示：

• 把该input作为参数传递进ref函数
• 创建一个input的属性存储传入值

设置默认值

• defaultValue

<input
    type="text"
    defaultValue='设置该输入框的默认值' 
/>