//跟踪表单的值
import React, { Component } from 'react';
class FlavorForm extends Component {
constructor(props) {
super(props);
this.state = {value: ''};
this.handleChange = this.handleChange.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
}
//用onChange选择方法获取select用户点击的value,并赋给state
handleChange(event) {
this.setState({value: event.target.value});
}
//onSubmit事件获取state中的值
handleSubmit(event) {
console.log(this.state.value)
event.preventDefault();
}
render() {
return (
<form onSubmit={this.handleSubmit}>
<label>
选择您最喜欢的网站
<select value={this.state.value} onChange={this.handleChange}>
<option value="Google">Google</option>
<option value="Runoob">Runoob</option>
<option value="Taobao">Taobao</option>
<option value="Facebook">Facebook</option>
</select>
</label>
<input type="submit" value="提交" />
</form>
);
}
}
export default FlavorForm