如何在 Fluxible react.js 中绑定输入字段？查看 todo 的示例应用程序，它们在输入框上绑定了一个 onchange 事件并将其绑定到一个 onchange 方法。对多个字段执行相同的技术似乎很乏味——每个字段都有单独的方法和事件处理程序。有没有办法从提交时的输入框中获取值？我应该将字段值存储在状态中吗？
import React from 'react';
import registerUser from '../actions/registerUser';
class Register extends React.Component {
constructor(props) {
super(props);
this.state = {
username:'',
password:'',
email:'',
errorMessage:null
};
//this.state = this.getStoreState();
}
register = (event, value) => {
event.preventDefault();
event.stopPropagation();
console.log(value);
let username = this.state.username.trim();
let password = this.state.password.trim();
let email = this.state.email.trim();
if (username && password && email) {
this.context.executeAction(registerUser, {
username: username,
password: password,
email: email
});
} else {
this.state.errorMessage = "missing required fields"
}
this.setState({text: event.target.value});
};
//todo handle error and success
render() {
return (
<div>
{this.state.errorMessage}
<form className="pure-form pure-form-stacked">
<fieldset>
<legend>Register</legend>
<input type="email" placeholder="Email" />
<input type="text" placeholder="Username" />
<input type="password" placeholder="Password" />
<button onClick={this.register} type="submit" className="pure-button pure-button-primary">Sign Up</button>
</fieldset>
</form>
</div>
);
}
}
export default Register;