el-upload图片上传

<template>
 <el-card style="width: 15rem">
	<el-upload :multiple="multiple" action="${pageContext.request.contextPath}/lookup/editEvidence/123"
	:limit='1'  drag list-type="picture" :auto-upload="false" :http-request="uploadFile" ref="upload">
	<i class="el-icon-upload"></i>
	<div class="el-upload__tip" slot="tip">只能上传一个jpg/png文件</div>
	</el-upload>
     <el-button @click="subPicForm" type="primary" style="width: 13rem;margin-top: 1rem">提交图片</el-button>
	 </el-card>
</template>

其中:limit='1’为限制上传个数，本文限制上传1个
在data中定义

data(){
return{
        multiple: true,
        formDate: "",
}
}

methods:{
      uploadFile(file) {
        this.formDate.append('file', file.file);
      },
      subPicForm() {
        this.formDate = new FormData()
        this.$refs.upload.submit();
        //向formDate追加我所需参数
        this.formDate.append('uuid', this.userInformation.id);
        //设置请求头
        let config = {
          headers: {
            'Content-Type': 'multipart/form-data'
          }
        }
        console.log(this.formDate,this.$refs.upload,config)
        this.axios.post("/api/profile/edit_head_image", this.formDate, config).then(res => {
          //上传成功回传输出---因个人定义自行作出调整
          if (res.data.errno === "6") {
            this.$notify({
              title: res.data.errmsg,
              type: 'success'
            })
          }
          //上传失败输出---因个人定义自行作出调整
          else {
            this.$notify({
              title: res.data.errmsg,
              type: 'error'
            })
          }
        }).catch(res => {
          console.log(res)
        })
      },
}

能力不足水平有限
有问题别讲脏话骂人
来学习交流
有问必答
email:1848199654@qq.com