如何发送一个数组的文件使用FormData?

Question

在laravel的后端，我有一个名为"file_ticket"并且我需要发送一个数组，其中包含通过输入文件发送的文件，我在前端使用vue js。我如何将这个数组发送到后端?当我尝试只发送数组时，请求返回类似于"object file">

的内容

结果图像

onChange(e) {
let getFiles = [...this.$refs.file.files]

if(!getFiles) return
([...getFiles]).forEach(f => {
this.filelist.push(f)
})      
},

saveTicket(event){
event.preventDefault()      

let frmData =  new FormData()
frmData.append('subject', this.newTicket.subject) 
frmData.append('service', this.newTicket.service) 
frmData.append('description', this.newTicket.description)       
frmData.append('file_ticket', this.filelist)       
frmData.append('client_id', this.idUser) 

const url = `ticket/new_ticket`
axios.post(url, frmData).then((response) => {
console.log(response)
})

Answer 1

只要将filelist中的所有文件使用相同的键附加到formdata，它将发送一个文件数组

this.filelist.forEach((file) => {
frmData.append('file_ticket', file);
});

Answer 2

不要像问题中那样将文件追加到另一个数组中，直接追加，但要加上方括号。

而不是使用这个:

this.filelist.push(f)

只需像这样将文件附加到表单数据对象:

frmData.append('file_ticket[]', file);

在你的Laravel控制器中使用这段代码来获取你的文件(我假设你正在使用POST，你正在传递请求对象作为你的参数到你的控制器函数)

if ($request->hasFile('file_ticket')) {
$file_tickets = $request->file('file_ticket');
foreach ($file_tickets as $index => $file_ticket) {
//The rest of your code goes here
}
}

hasFile函数检查您的请求是否有文件票证，$request->file用于获取文件数组。