我有一个简单的表单，其中包含如下所示的电子邮件字段和密码字段
<Form noValidate validated={validated} onSubmit={this.handleSubmit}>
<Form.Group controlId="formEmail">
<Form.Label>Email address</Form.Label>
<Form.Control type="email" onChange={this.emailValidator} placeholder="Enter email" required />
</Form.Group>
<Form.Group controlId="formPassword">
<Form.Label>Password</Form.Label>
<Form.Control type="password"placeholder="Password" required />
</Form.Group>
<Button type="submit" size="lg" variant="light">
Login
</Button>
</Form>
当用户开始输入电子邮件地址时，我想在电子邮件字段中包含引导表单验证，而在按下“提交”按钮时，我要在密码字段中包含别名。
我的方法如下。
handleSubmit = event => {
const { loggingUser } = this.props;
const form = event.currentTarget;
event.preventDefault();
if (form.checkValidity() === false) {
event.preventDefault();
event.stopPropagation();
} else {
const loggingData = {
"eMail": event.target.formEmail.value,"password": event.target.formPassword.value,}
loggingUser(loggingData);
}
this.setState({
validated: true
})
};
emailValidator = event =>{
const form = event.currentTarget;
if (form.checkValidity() === false) {
event.preventDefault();
event.stopPropagation();
}
this.setState({
validated: true
})
}
但是当我开始在电子邮件地址字段中键入时，两个验证都会触发并显示红色边框。仅当用户开始输入电子邮件地址时，我如何才能触发该电子邮件地址的引导程序验证。