使用formData传递数组·

formData其实就相当于是个表单,平常我们创建表单需要通过标签,而我们使用formData就可以直接创建一个表单,因为我们需求中还得有上传文件的操作,所以我们使用formData来给后台传递数据。

我这边业务需求是点击保存时,会将表单和文件一起上传给后台,并且还是个数组,因为有多个IP地址。

image.png

父组件使用ref获取upload组件方法, 这块还有一点需要注意,因为我的upload是在v-for循环下面,所以我们获得真实节点时也是一个数组,需要遍历取一下。

 const {domains,taskData} = this.form
  const formdata = new FormData()
  this.$refs.Upload.map((item,index) => {
  item.benchmark(domains,taskData,index,formdata)
 this.$axios.post('/update/upload_benchmark/',formdata,config).then(res => {
              const {code,msg} = res.data
              if(code === 0){
                this.$message({
                  message: '保存成功',
                  type: 'success'
              }else{
                this.$message.error(msg)

upload组件中的方法

  benchmark(targets, taskData, index, formdata) {
                formdata.append(`targets[${index}][target]`, targets[index].value)
                formdata.append(`targets[${index}][task_type]`, taskData)
                formdata.append(`targets[${index}][benchmark_file]`, this.upFileList[0])
                if (!this.upFileList[0]) {