el-upload自定义上传

常规el-upload组件 使用http-request 覆盖默认的上传行为，可以自定义上传的实现

<div class="upload-demo">
    <el-upload 
    drag 
    action="#" 
    :http-request="uploadImage" 
    accept=".xls,.xlsx,.csv" 
    :on-error="upError" 
    :on-remove="upRemve" 
    :on-change="upChange" 
    :file-list="fileList">
        <img class="icon-upload" src="xxxxxxxxx/images/icon-upload.png" alt="">
        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
        <div class="upload__type">支持扩展名：.xls .xlsx .csv</div>
    </el-upload>
</div>

data() {
  return {
    fileList: [],
    SystemUrl: 'xxxxxxxx.upload' //上传链接
  }
},

   // 自定义上传方法
    uploadImage(file) {
      var formData = new FormData()
      formData.append('file', file.file)
      var requestConfig = {
        headers: {
          'Content-Type': 'multipart/form-data'
        }
      }
      axios.post(this.SystemUrl, formData, requestConfig)
        .then((res) => {
          if (res.serviceCode === 100) {
            this.$message({
              showClose: true,
              message: '文件上传成功',
              type: 'success'
            })
          } else {
            this.fileList = []
            this.$message({
              showClose: true,
              message: res.serviceMessage,
              type: 'error'
            })
          }
        })
    },
   // 上传失败
    upError() {
      this.fileList = []
      this.$message({
        type: 'error',
        message: '文件上传失败',
        showClose: true
      })
    },
    // 上传的文件改变时（覆盖原来的文件）
    upChange(file, fileList) {
      if (fileList.length > 0) {
        this.fileList = [fileList[fileList.length - 1]]
      }
    },
    // 移除列表
    upRemve(file) {
      // console.log(file)
    },