vue el-upload 上传图片

  <el-upload
  class="upload-demo"
  action="#"
  :before-upload="handlePreview"
  :on-remove="handleRemove"
  :file-list="fileList"
 :http-request="uploadImage"
 :limit=1
 :multiple="false"
  list-type="picture">
  <el-button size="small"  type="primary">点击上传</el-button>
  <div slot="tip" class="el-upload__tip">只能上传jpg/png文件,且不超过500kb</div>
</el-upload>

  handlePreview(file) {
        
         let fd = new FormData(); //通过form数据格式来传
        fd.append("Files", file); //传文件
         this.AppfromDataimage.Files=fd
      },
   handleRemove(file, fileList) {
       
        console.log(file, fileList);
        
      },
    uploadImage(file){
 
    }
   <el-button type="primary" @click="submitimage(AppfromDataimage)">确 定</el-button>


//Api url 应该这样传参
export function AddAppImage(data,AppSabb,AppType) {
    // debugger
    return request({
        url: '/AppImage/AddAppImage?AppSabb='+AppSabb+'&AppType='+AppType+'',
        method: 'post',
        data
    })
}

AppfromDataimage 参数  记得定义 

 submitimage(){
      this.handleRemove()
//如果传参数 就这样进行传参 (this.AppfromDataimage 参数  记得定义)
AddAppImage(this.AppfromDataimage.Files,this.AppfromDataimage.AppSabb,this.AppfromDataimage.AppType).then((res)=>{
           if (res.list) {
              this.$message({
                message: '添加成功',
                type: 'success',
              }) 
          
           }else{
              this.$message({
                message: '添加失败',
                type: 'error',
              })
           }
           
        })
    },

所有参数 放到 params里面  

 
  export const importOrder = params => vueRequest({
    apiUrl: `${appConfigs.urlWebHttp}${prefix}/orderManager/importOrder`,
    params,
    type: 'POST',
    apiCode: 400024,
    isSendRsa: false,
    isUcode: true
});

    formData.append("filePath", val.file);
    formData.append("mouldId", this.fileListId);

    // 导入订单方法
    async importOrderData(val) {
      let formData = new FormData();
        formData.append("filePath", val.file);
        formData.append("mouldId", this.fileListId);
      let { data, code, message } = await importOrder(formData);
      if (Number(code) === 0) {
        this.$message({
          type: "success",
          showClose: true,
          customClass: "customClass-confirm",
          message: "成功导入订单",
        });
      } else {
        this.$message({
          type: "error",
          showClose: true,
          customClass: "customClass-confirm",
          message: message,
        });
      }
    },


版权声明:本文为weixin_42120669原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。