表单
遇到的问题整理,
如何获取input的value值:在input 里面设置一个ref属性,方便的定位的这个组件
记住不要将this.setState({value:e.target.value})写成this.setState=({value:e.target.value})
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
class LoginControl extends React.Component {
constructor(props) {
super(props)
this.state = {value : ''}
this.handleSubmit = this.handleSubmit.bind(this)
this.handleChange = this.handleChange.bind(this)
}
handleSubmit(e) {
alert(this.refs.myTextInput.value)
e.preventDefault()
}
handleChange(e){
this.setState({value:e.target.value})
}
render() {
//const value = this.state.value
return (
<form onSubmit= {this.handleSubmit}>
<label >
Name :
<input type="text" value={this.state.value} ref="myTextInput" onChange={this.handleChange} />
</label>
<input type="submit" value="Submit"/>
</form>
);
}
}
ReactDOM.render(
<LoginControl />,
document.getElementById('root')
);