Formik 表单在 iPhone Chrome 浏览器上意外重置

Question

我在 React 应用程序中遇到 Formik 表单问题。当我在 iPhone 的 Chrome 浏览器上使用 Formik 提交表单时，表单会自动重置，无需任何显式调用

resetForm

。此行为不一致，因为它不会发生在其他浏览器或桌面设备上。

详情：

• 框架/库：React、Formik
• 浏览器： iPhone 上的 Chrome
• 预期行为：提交表单后，除非显式调用

  resetForm

  ，否则表单不应重置。
• 实际行为： 表单在提交后立即重置，无需调用

  resetForm

  。

代码片段：

import React from 'react';
import { Formik, Form, Field } from 'formik';

const MyForm = () => {
  return (
    <Formik
      initialValues={{ name: '' }}
      onSubmit={(values) => {
        console.log('Form values:', values);
        // No resetForm call here
      }}
    >
      {({ isSubmitting }) => (
        <Form>
          <Field type="text" name="name" placeholder="Name" />
          <button type="submit" disabled={isSubmitting}>
            Submit
          </button>
        </Form>
      )}
    </Formik>
  );
};

export default MyForm;

重现步骤：

1. 在 iPhone 的 Chrome 浏览器上打开应用程序。
2. 填写表格字段。
3. 提交表格。
4. 观察表单自动重置，无需任何显式

   resetForm

   调用。

故障排除尝试：

• 确保提交处理程序中不存在

  resetForm

  调用。
• 检查了是否有任何表单重置副作用，但没有发现。
• 已验证该问题特定于 iPhone Chrome 浏览器，因为它在其他浏览器和桌面设备上可以正常工作。

问题：

• 有人在 iPhone 的 Chrome 浏览器上遇到过类似的 Formik 行为吗？
• 此特定浏览器/设备组合是否有任何已知问题或解决方法？

任何帮助或建议将不胜感激！

Answer 1

我测试了您的代码，没有发现您的代码有任何问题 即使我在 iphone chrome 中测试了你的代码，它也运行良好

您可以使用此代码代替 event.preventDefault();