我试图在最新版本的NextJS中实现表单提交逻辑。在我例子中，我有一些接受多个文件或图像的表单输入和文件输入。现在我的要求是我想在api/addDetails中进行API调用，然后将表单数据保存到mongodb数据库，并将图像保存到cloudinary或本地服务器。我需要生成的每个图像的网址，并保存在数据库中，以及这样当我们提出一个获取请求，我们可以从数据库中获取所有的细节。我分享的是示例形式和一些逻辑。可能会有更多的投入，但这将足以让我开始。请考虑我作为你的实习生和分享你的帮助：）.
我试过cloudinary，multer，令人生畏，都一个接一个，也一起。大多数时候我有一个问题，如未定义的头，关键的依赖性错误，咖啡脚本错误等等。我分享你简单的形式与3输入，帮我写后端代码来处理API请求。你可以在我的前端修改任何代码我只是想让它工作现在。

"use client";
import axios from "axios";
import React, { FormEvent, useRef, useState } from "react";

const AddDetails= () => {
  const nameRef = useRef<HTMLInputElement>(null);
  const descriptionRef = useRef<HTMLInputElement>(null);
  const fileRef = useRef<HTMLInputElement>(null);

  const handleSubmit = async (e: FormEvent<HTMLFormElement>) => {
    e.preventDefault();

    const nameInput = nameRef.current!;
    const descriptionInput = descriptionRef.current!;
    const fileInput = fileRef.current!;

    const formData = new FormData();
    for (const file of Array.from(fileInput.files ?? [])) {
      formData.append("files", file);
    }
    formData.append("name", nameInput.value);
    formData.append("description", descriptionInput.value);

    await axios.post("/api/addDetails", formData);
  };

  return (
    <>
      <form onSubmit={handleSubmit}>
        <input type="file" name="files" ref={fileRef} multiple />
        <label htmlFor="name" className="block text-sm font-medium ">
         Name
          </label>
        <input
          type="text"
          name="name"
          ref={nameRef}
          className="mt-1 p-2 border border-gray-300 rounded-md focus:outline-none focus:ring-blue-500 focus:border-blue-500 block w-full shadow-sm"
        />
         <label htmlFor="name" className="block text-sm font-medium ">
         Description
          </label>
        <input
          type="text"
          name="description"
          ref={descriptionRef}
          className="mt-1 p-2 border border-gray-300 rounded-md focus:outline-none focus:ring-blue-500 focus:border-blue-500 block w-full shadow-sm"
        />
        <button
          type="submit"
          className="px-2 py-1 rounded-md bg-violet-50 text-violet-500"
        >
          Upload
        </button>
      </form>
    </>
  );
};

export default AddDetails;

谢谢大家，非常感谢