0
如何绑定flux.xml中的输入字段？查看todo的示例应用程序，他们绑定输入框上的onchange事件并将其绑定到onchange方法。对多个字段进行相同的技术似乎很乏味 - 为每个字段设置一个单独的方法和事件处理程序。有没有办法从提交的输入框中获取值？我应该将字段值存储在状态中吗？如何在flux.xml中绑定输入字段react.js
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;
你可以绑定的所有字段相同的变化方法，添加一个参数上哪个字段进行更新。然后在set状态下根据该参数设置状态[field]。 – thsorens