element-ui upload 上传组件附带额外参数进行上传（表单形式，多个参数）

之前一直使用upload组件单个上传文件，最近遇到需要上传表单字段，表单中有多个参数

下图是接口要求：

 官网上传组件中提供了响应的功能实现，但是demo中未演示，不注意看文档参数的话，可能会不知道这个：

接受一个object来作为参数传递，

我的组件这么写：

<el-upload
        class="upload-demo"
        drag
        name="file"
        :limit="1"
        :data="insertProgram"
        :on-exceed="handleFileOneExceed"
        :before-upload="beforeFileUpload"
        :on-success="handleFileSuccess"
        :on-remove="handleFileRemove"
        :file-list="fileList"
        :action="requestAddProgram">
        <i class="el-icon-upload"></i>
        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
        <div class="el-upload__tip" slot="tip">只能上传txt文件，格式范例：文件名为时间如:2020-03-02.txt,内容:23:00 晚间新闻</div>
      </el-upload>

data中：

data () {
    return {
      insertProgram: {
        liveId: 0
      }
}}

这样就将file 以及参数作为表单传送

上传作为mixins引入：

import {requestUploadImg} from '@/api/api'
// 混入对象上传组件。直接混入，需要覆盖上传成功后的回调
/* <el-upload
            class="upload-demo"
            drag
            name="img"
            :limit="1"
            :on-exceed="handleFileOneExceed"
            :on-success="handleFileSuccess"
            :on-remove="handleFileRemove"
            :file-list="fileList"
            :action="requestUploadFile">
            <i class="el-icon-upload"></i>
            <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
<!--            <div class="el-upload__tip" slot="tip">只能上传jpg/png文件，且不超过500kb</div>-->
          </el-upload> */
// 混入组件需要监听 uploadFileList
const fileUpload = {
  data () {
    return {
      requestUploadFile: requestUploadImg,
      fileList: [],
      uploadFileList: []
    }
  },
  methods: {
    beforeFileUpload (file) {
      const isTXT = file.type.indexOf('text') > -1
      if (!isTXT) {
        this.$message.error('请选择txt文件')
      }
      return isTXT
    },
    handleFileOneExceed (files, fileList) {
      this.$message.warning('禁止上传多个文件')
    },
    handleFileRemove (file, fileList) {
      this.uploadFileList.splice(this.uploadFileList.findIndex(item => item === file.response.body), 1)
    },
    handleFileSuccess (res, file) {
      this.uploadFileList.push(res.body)
      this.$notify.success({
        title: '成功',
        message: '文件上传成功'
      })
    }
  }
}
export default fileUpload

 这个组件全部代码为：（可以只看关心部分的代码）：

<template>
  <div>
    <div class="model-top">
      <span class="model-title">频道管理</span>
      <div>
        <el-button type="primary" @click="openAddSource">新增</el-button>
        <el-select v-model="channelSearchForm.status" placeholder="请选择">
          <el-option
            v-for="item in channelStatus"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
        <el-input placeholder="搜索关键词" v-model="channelSearchForm.title" class="model-input">
          <el-button slot="prepend" icon="el-icon-search"></el-button>
        </el-input>
      </div>
    </div>
    <div>
      <div>
        <el-table
          :data="tableData"
          style="width: 100%">
          <el-table-column
            type="index"