React版本：15.4.2
**翻譯：xiyoki **
在大多數(shù)情況下旗唁，我們建議使用受控組件來實(shí)現(xiàn)表單枫吧。在受控組件中，表單數(shù)據(jù)由React組件處理直奋。替代方法是不受控組件狼荞，其中表單數(shù)據(jù)由DOM本身處理。
編寫不受控組件而不是為每個(gè)狀態(tài)更新編寫事件處理程序帮碰，你可以使用ref從DOM獲取表單值相味。
例如，在一個(gè)不受控的組件中殉挽，此代碼接收單個(gè)名稱：
class NameForm extends React.Component {
constructor(props) {
super(props);
this.handleSubmit = this.handleSubmit.bind(this);
}
handleSubmit(event) {
alert('A name was submitted: ' + this.input.value);
event.preventDefault();
}
render() {
return (
<form onSubmit={this.handleSubmit}>
<label>
Name:
<input type="text" ref={(input) => this.input = input} />
</label>
<input type="submit" value="Submit" />
</form>
);
}
}
由于不受控組件在DOM中保持了真實(shí)來源丰涉，因此當(dāng)使用不受控組件時(shí)拓巧，有時(shí)更容易集成React和非React代碼。如果你想quick和dirty一死，它也可以稍微少一些代碼肛度。否則，通常應(yīng)使用受控組件投慈。
如果仍然不清楚在特定情況下應(yīng)該使用哪種類型的組件承耿，則這篇文章能為你提供幫助this article on controlled versus uncontrolled inputs 。
Default Values（默認(rèn)值）
在React渲染生命周期中伪煤，表單元素上的value屬性將覆蓋DOM中的值加袋。對(duì)于不受控組件，你通常希望React指定初始值抱既，但不要控制后續(xù)更新职烧。要處理這種情況，你可以指定defaultValue屬性而不是value屬性防泵。
render() {
return (
<form onSubmit={this.handleSubmit}>
<label>
Name:
<input
defaultValue="Bob"
type="text"
ref={(input) => this.input = input} />
</label>
<input type="submit" value="Submit" />
</form>
);
}
同樣,<input type="checkbox">和 <input type="radio">支持 defaultChecked,<select>支持defaultValue蚀之。
