javascript - JavaScript new formData().append 不适用于上传的文件

Question

在我的 Reactjs 应用程序中，我使用 AXIOS 将包含一些数据的上传文件发送到 API。经过解决后，我设置了以下代码并尝试将其发送到后端。但是我无法将文件发送到 API。输入文件并将其发送到 API 后，“网络中的请求有效负载”选项卡将上传的文件变量显示为 Empty {} always。我该如何解决这个问题？

uploadFile(event) {
        let file = event.target.files[0];
        let data = new FormData();
        data.append('file', file);

        const files = [
            {
                name: "n1",
                description: "d1",
                file: data,
                business_file_type: 1
            }
        ];
        const project_id = 1;

        const allData = { files, project_id }

        API.post('project/files/upload', allData)
            .then(({ data }) => {
                console.log("success", data);
            })
            .catch((err) => {
                console.log("AXIOS ERROR: ", err);
            })
    }

<input className={classes.input} type="file" id="fileInput" name="ifile" onChange={this.uploadFile} />

标签： javascriptreactjsaxios

Answer 1

试试这个：传递表单数据中的所有内容。

data.append('file', file);

const files_related_data = [
    {
        name: "n1",
        description: "d1",
        business_file_type: 1
    }
];
const project_id = 1;
data.append('files_related_data', files_related_data);
data.append('project_id', project_id);

const allData = data;