<el-upload class="avatar-uploader"
action=""
:show-file-list="false"
:on-success="handleAvatarSuccess"
:before-upload="beforeAvatarUpload">
<img v-if="Model.ImageUrl" :src="Model.ImageUrl" class="avatar">
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
data: function () {
return {
imageUrl: ‘’,
Model: {
ImageUrl: ''
}
}
}
methods: {
handleAvatarSuccess(res, file) {
console.log("imageUrl", file)
const formData = new FormData();
formData.append('ImageUrl-file', file.raw);
formData.append('file_id', '0');
var that = this;
$.ajax({
type: "post",
dataType: "json",
url: localAd + "/Upload/UploadImage",
headers: {
'X-Exhibitor-Token': localStorage.getItem('setExhHeader'),
},
data: formData,
processData: false,
contentType: false,
success: function (data) {
console.log("图片返回", data);
if (data.code == 1) {
that.imageUrl = data.msg;
that.Model.ImageUrl = data.msg;
} else {
alert('图片上传失败')
}
}, error: function (err) {
console.log(err);
}
})
},
beforeAvatarUpload(file) {
const isLt2M = file.size / 1024 / 1024 < 10;
if (!isLt2M) {
this.$message.error('上传头像图片大小不能超过 10MB!');
}
return isLt2M;
}
}