如何获取很长的长表单的formData

Question

我目前正在 NextJS 中处理一个很长的表单，我最近了解了服务器操作，并尝试用它做一些关于表单和变异数据的事情，它只是给出了一些关于处理服务器操作的示例，例如：

  const handleCreate = async (formData: FormData) => {
    "use server";
    const rawFormData = {
      id: formData.get("id"),
    };
    // Send rawFormData and do something ....
  };

但问题是，当我有一个很长的表单时，如何制作 rawFormData 而不执行以下操作：

    const rawFormData = {
      id: formData.get("id"),
      name: formData.get("name"),
      address: formData.get("address"),
      gender: formData.get("gender"),
      // many many fields
      dob: formData.get("dob"),
    };

我尝试了一种虚拟方法，在表单中传递一组字段并这样做

  const handleCreate = async (formData: FormData,fields: any[]) => {
    "use server";

    let rawFormData: any = {};
    fields.forEach((field: any) => (rawFormData[field] = formData.get(field)));
    // Fetch and do something ....
  };

但是它导致另一个错误，说 NextJS 不允许将除 formData 之外的任何内容传递到操作中 我该如何解决这个问题？

Answer 1

参见 https://developer.mozilla.org/en-US/docs/Web/API/FormData

我没有检查以下代码。如果它符合您的要求，请报告。否则，您始终可以诉诸其他

FormData

方法。

const plainObject = Object.fromEntries(formData.entries());