Express 使用vue和multer的Axios多重上传

我需要使用vue.js 2.0和multer进行多次文件上传

我已经按照此文档多次上传：

这是我的vue模板：

<label>Files
    <input name="streamfile" type="file" id="files" ref="files" multiple @change="handleFileUploads" />
</label>
<a v-on:click="submitFiles" class="btn btn-primary">Submit</a>

我得到了这个错误：

MulterError: Unexpected field
    at wrappedFileFilter (C:\UwAmp\www\vue-starter-webpack-cli-4-node\node_modules\multer\index.js:40:19)
    at Busboy.<anonymous> (C:\UwAmp\www\vue-starter-webpack-cli-4-node\node_modules\multer\lib\make-middleware.js:114:7)
    at Busboy.emit (events.js:189:13)
    at Busboy.emit (C:\UwAmp\www\vue-starter-webpack-cli-4-node\node_modules\busboy\lib\main.js:38:33)
    at PartStream.<anonymous> (C:\UwAmp\www\vue-starter-webpack-cli-4-node\node_modules\busboy\lib\types\multipart.js:213:13)
    at PartStream.emit (events.js:189:13)
    at HeaderParser.<anonymous> (C:\UwAmp\www\vue-starter-webpack-cli-4-node\node_modules\dicer\lib\Dicer.js:51:16)
    at HeaderParser.emit (events.js:189:13)
    at HeaderParser._finish (C:\UwAmp\www\vue-starter-webpack-cli-4-node\node_modules\dicer\lib\HeaderParser.js:68:8)
    at SBMH.<anonymous> (C:\UwAmp\www\vue-starter-webpack-cli-4-node\node_modules\dicer\lib\HeaderParser.js:40:12)

编辑：

只要我只发送一个文件，它就可以工作：

Vue.js:

var formData = new FormData();
formData.append('file',this.files[0]);
axios.post(this.server + 'files',
                    formData, {
                        headers: {
                            'Content-Type': 'multipart/form-data'
                        }
                    }
                ).then(function (response) {
                })
                .catch(function (error) {
                });

var upload = multer({ dest: "uploads/" });

    app.post("/files", upload.array("file", 10), function(req, res, err) {
      if (err) {
        console.log(err);
      }
      req.files.forEach(function(file) {
        console.log(file);
      });
    });

Node.js:

var formData = new FormData();
formData.append('file',this.files[0]);
axios.post(this.server + 'files',
                    formData, {
                        headers: {
                            'Content-Type': 'multipart/form-data'
                        }
                    }
                ).then(function (response) {
                })
                .catch(function (error) {
                });

var upload = multer({ dest: "uploads/" });

    app.post("/files", upload.array("file", 10), function(req, res, err) {
      if (err) {
        console.log(err);
      }
      req.files.forEach(function(file) {
        console.log(file);
      });
    });

只要我尝试发送一个数组，它就不会工作，并抛出MulterError:Unexpected field

  formData.append(file,this.files[0]);
  formData.append(file,this.files[1]);

已解决：如果有人遇到问题，这很烦人！：

var formData = new FormData();
formData.append('file',this.files[0]);
axios.post(this.server + 'files',
                    formData, {
                        headers: {
                            'Content-Type': 'multipart/form-data'
                        }
                    }
                ).then(function (response) {
                })
                .catch(function (error) {
                });

var upload = multer({ dest: "uploads/" });

    app.post("/files", upload.array("file", 10), function(req, res, err) {
      if (err) {
        console.log(err);
      }
      req.files.forEach(function(file) {
        console.log(file);
      });
    });

这是我现在的vue.js 2.0代码，请注意“内容类型”：“未定义”：

var formData = new FormData(); 
for (var i = 0; i < this.files.length; i++) {
    var file = this.files[i];
    formData.append('file', file);
}
axios.post(this.server + 'files',
    formData, {
        headers: { crossdomain: true,
            'Content-Type': 'undefined'
        }
    }
).then(function (response) {
})
.catch(function (error) {
});

---

请不要在问题中添加答案。用户可能不会完整地阅读问题（因为它相当长），也不会注意到您在问题本身中回答了它。请添加正确答案，并在宽限期结束时接受。