我正在尝试使用 react-bootstrap
创建表单验证,并希望避免为每个输入创建验证函数。
我有这个输入:
<Input
hasFeedback
type="text"
label="Username"
bsStyle={this.state.UsernameStyle}
onChange={this.handleChange.bind(this, 'Username')}
value={this.state.Username}
bsSize="large"
ref="inptUser"
placeholder="Enter Username"
/>
另外,我有两个函数来处理状态的验证和更新:
handleChange: function(name, e) {
var state = {};
state[name] = e.target.value;
this.setState(state);
var namestyle = name + 'Style';
this.setState(this.validationState(namestyle, e));
},
&
validationState: function(style, event) {
var length = event.target.value.length;
if (length > 4) this.setState({style: 'success'});
else if (length > 2) this.setState({style: 'warning'});
return {style};
}
此时,如果我将 style
更改为 Username
,我也可以让这个解决方案适用于该特定输入。我可以做一个 if 语句,并根据我在 style
中得到的字符串,我可以调用适当的 setState,但它们是更好的方法吗?
谢谢!
最佳答案
var yourVariable = "name";
this.state[yourVariable];
相当于:
this.state.name;
如果你想在设置状态下使用你的变量,你可以使用这个:
var value = "peter";
this.setState({[yourVariable]: value});
相当于:
this.setState({name: value)};
关于javascript - 使用变量作为 `this.state` 调用 ReactJS 的一部分,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35047153/