Handling Multiple form Data.

multipleFormData.ts

import axios from "axios";
import React from "react";

const Index = () => {
  const handleSubmit = async (e) => {
    e.preventDefault();
    const files = e.target.file.files;
    const name = e.target.text.value;
    const formData = new FormData();

    formData.append("video", files[0]); // Use files[0] to get the first selected file
    formData.append("phoneNumber", "1234567890");
    formData.append("email", "test@example");

    const result = await axios.post(
      "your_api_link",
      formData,
      {
        headers: {
          "Content-Type": "multipart/form-data",
        },
      }
    );

    console.log(result);
  };

  return (
    <div>
      <form onSubmit={handleSubmit}>
        <input name="file" type="file" accept="video/*" />{" "}
        <input name="text" type="text" />
        <button type="submit">Submit</button>
      </form>
    </div>
  );
};

export default Index;

Still, if you have problems uploading formData, remove headers: { "Content-Type": "multipart/form-data", }, and leave it as default.