问题描述
我正在使用Formik
用于React
应用中的一个小表单。
方法handleSubmit
在用户按Enter键时触发。
有什么方法可以防止这种触发吗? 我在以前的文档中没有找到任何东西...
谢谢。
推荐答案
您可以按如下方式添加onKeyDown
处理程序:
/**
* Stop enter submitting the form.
* @param keyEvent Event triggered when the user presses a key.
*/
function onKeyDown(keyEvent) {
if ((keyEvent.charCode || keyEvent.keyCode) === 13) {
keyEvent.preventDefault();
}
}
/**
* Sample form component.
*/
function Example() {
return (
<Formik initialValues={{ name: "" }} onSubmit={() => console.log("Submit")}>
<Form onKeyDown={onKeyDown}>
<div>
<label htmlFor="name">Name</label>
<Field id="name" name="name" type="text" />
</div>
<button type="submit">Submit</button>
</Form>
</Formik>
);
}
请参阅CodeSandboxexample here。