不操作ref 动态更改数据 (react 要尽量少得使用ref)
state = {
username: '',
password: ''
}
saveForm = (type) => {
console.log(type);
return (e) => {
this.setState({
[type]: e.target.value
})
}
}
render() {
return (
<form onSubmit={this.dome1}>
用户名: <input onChange={this.saveForm("username")} type="text" name='username' />
mima : <input onChange={this.saveForm("password")} type="password" name='password' />
<button>dengl </button>
</form>
)
}
dome1 = (e) => {
e.preventDefault(); // 阻止表单提交
console.log(this.state);
}
另一种写法
state = {
username: '',
password: ''
}
saveForm = (type, event) => {
this.setState({ [type]: event.target.value })
}
render() {
return (
<form onSubmit={this.dome1}>
用户名: <input onChange={event => this.saveForm("username", event)} type="text" name='username' />
mima : <input onChange={event => this.saveForm("password", event)} type="password" name='password' />
<button>dengl </button>
</form>
)
}