在Formik中提交后重置/清空表单可以通过以下步骤实现:
下面是一个示例代码:
import React from 'react';
import { Formik, Form, Field } from 'formik';
const initialValues = {
name: '',
email: '',
password: '',
};
const MyForm = () => {
const handleSubmit = (values, { resetForm }) => {
// 提交表单的逻辑
console.log(values);
// 重置表单
resetForm();
};
return (
<Formik initialValues={initialValues} onSubmit={handleSubmit}>
<Form>
<label htmlFor="name">Name</label>
<Field type="text" id="name" name="name" />
<label htmlFor="email">Email</label>
<Field type="email" id="email" name="email" />
<label htmlFor="password">Password</label>
<Field type="password" id="password" name="password" />
<button type="submit">Submit</button>
</Form>
</Formik>
);
};
export default MyForm;
在上面的代码中,我们使用Formik组件包裹了一个表单,并设置了initialValues属性来定义表单的初始值。在handleSubmit函数中,我们可以执行提交表单的逻辑,并在最后调用resetForm方法来重置表单。
这是一个基本的示例,你可以根据你的实际需求进行修改和扩展。如果你想了解更多关于Formik的详细信息,可以访问腾讯云的Formik产品介绍页面:Formik产品介绍。
注意:以上答案中提到的腾讯云产品链接仅为示例,实际使用时请根据自己的需求选择适合的产品。
领取专属 10元无门槛券
手把手带您无忧上云