element ui 中 el-upload 组件 用自定义函数覆盖

element ui el-upload 组件 用自定义函数覆盖 action

在这里插入图片描述

<div class="formWrap" v-show="showImg == 1">
        <el-form-item label="图片地址：" :label-width="labelWidth">
          <el-upload
            action="#"
            :http-request="uploadImg"    //uploadImg    自定义请求函数
            :on-remove="handleRemove"     //图片移除
            :on-preview="handlePreview"  //图片预览
            :limit="1"
            list-type="picture"
            :file-list="fileList"
          >
            <el-button size="small" type="primary">点击上传</el-button>
          </el-upload>
        </el-form-item>
      </div>

methods: {
    async uploadImg(param) {
      const value = param.file
      let formData = new FormData()
      formData.append('file', value)
      const res = await uploadFile(formData)
      if (res.code === 1) {
        this.fileId = res.fileId
        //获取图片路径地址接口
        this.getImgUrl()
      } else {
        this.$message({
          type: 'error',
          message: res.message
        })
      }
    },
    handlePreview(file){},
    // 图片移除
    handleRemove(file) {
      const filePath = file.url
      const i = this.fileList.findIndex(item => item.url === filePath)
      this.fileList.splice(i,1)
    }
 }