javascript - onSubmit 不起作用（react-material-ui-form-validator）

Question

当我添加一个 ValidatorForm 组件（react-material-ui-form-validator）时，我可以输入输入但是当我输入数据并提交但状态和其他属性没有更新时，

我检查了控制台，onSubmit 不起作用

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

两个代码都不起作用...

我该如何修复代码？ValidatorForm 有问题吗？还是我的代码错了？

Answer 1

首先在您的句柄提交中尝试 event.preventDefault() 或者您也可以在按下“提交”按钮时调用句柄提交。

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>
    );
}