js 上传文件数组

upload.vue

<template>
  <el-upload
      action="/api/files/upload"
      :auto-upload="false"
      multiple
      :limit="3"
      :on-change="handleFilesChange"
      :file-list="fileList"
    >
      <el-button size="small" type="primary">选择文件</el-button>
      <div slot="tip" class="el-upload__tip">只能上传 jpg、png、gif 文件，且不超过 200kb </div>
    </el-upload>
    <el-button size="small" type="primary" @click="uploadBatch">上传</el-button>
</template>
<script>
import {
      
       uploadBatch } from '@/api/files'

export default {
      
      
  data() {
      
      
    return {
      
      
      fileList: []
    }
  },
  methods: {
      
      
    // 多文件上传
    uploadBatch() {
      
      
      var formData = new FormData()
      for (const item of this.fileList) {
      
      
        formData.append('files', item.raw)
      }
      uploadBatch(formData).then(({
       
        code }) => {
      
      
        if (code === 20000) {
      
      
          this.$message.success(`文件上传成功`)
        }
      })
    },
    handleFilesChange(file, fileList) {
      
      
      this.fileList = fileList
    }
  }
}
</script>

api/files.js

import request from '@/utils/request'

// 多文件上传
export function uploadBatch(params) {
    
    
  return request.post('/api/files/upload/batch', params)
}