Question

我在Antd react form中有一个Decorated form输入，当我按Enter键时，默认的表单提交我不想要的验证行。我已经提供了onPressEnter的输入，但是从未触发过，并且没有表单提交，所以我想知道如何在具有React的Antd中避免这种行为。

<FormInput
                                        validateTrigger={['onBlur']}
                                        rules={[{
                                            type: 'email', message: 'The input is not valid E-mail!',
                                        }]}
                                        form={form}
                                        inputID={"email"}
                                        onPressEnter={this.onPressEnter}
                                    />


<Form onSubmit={this.handleSubmit}

handleSubmit = (e) => {
        console.log("hello");
        e.preventDefault();
    }

Answer 1

在您的<input />标记中，可以使用onKeyDown方法来防止出现以下默认情况：

onKeyDown={(e)=> e.keyCode == 13 ? e.preventDefault(): ''}

我在codesandbox.io上创建了一个工作示例。

在FormDecortor字段中按Enter键，停止在React Antd Design中提交表单

1 个答案: