onSubmit不工作(反应-材料-ui-表单-验证器)

Question

当我添加一个ValidatorForm组件(react-material form-验证器)时，我可以键入输入，但是当我输入数据和提交但是状态和其他属性不更新时，

我检查了控制台，onSubmit不工作了

<ValidatorForm ref="form"
                onSubmit={() => console.log('this is submit')}> 
<ValidatorForm ref="form"
                onSubmit={this.addNewColor}> 

两种代码都不起作用..。

我怎样才能修正密码？ValidatorForm有问题吗？还是我的代码错了？

Answer 1

首先，在句柄提交中尝试使用event.preventDefault()，或者在按下" submit“按钮时也可以调用handle。

handleSubmit = (event) => {
    event.preventDefault();
    //state changing logic here

}

render() {
    const { email } = this.state;
    return (
        <ValidatorForm
            ref="form"
            onError={errors => console.log(errors)}
        >
            <TextValidator
                label="Email"
                onChange={this.handleChange}
                name="email"
                value={email}
                validators={['required', 'isEmail']}
                errorMessages={['this field is required', 'email is not valid']}
            />
            <Button type="submit" onClick={this.handleSubmit}>Submit</Button>
        </ValidatorForm>
    );
}