<el-upload
class="avatar-uploader"
action=""
:http-request="uploadimage"
:before-upload="beforeAvatarUpload"
name="fileData"
:show-file-list="false"
:on-success="handleAvatarSuccess"
>
<img v-if="bannerRuleForm.imageUrl" :src="bannerRuleForm.imageUrl" class="avatar" />
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
uploadimage(item) {
let formData = new FormData();
let file = item.file;
formData.append('file', file);
uploadImg(formData).then(res => {
this.bannerRuleForm.imageUrl = res.data.url;
});
},
beforeAvatarUpload(file) {
const isJPG = file.type === 'image/jpeg' || 'image/png';
const isLt2M = file.size / 1024 / 1024 < 2;
if (!isJPG) {
this.$message.error('上传图片只能是 JPG 格式!');
}
if (!isLt2M) {
this.$message.error('上传图片大小不能超过 2MB!');
}
return isJPG && isLt2M;
},
handleAvatarSuccess(res, file) {
this.bannerRuleForm.imageUrl = URL.createObjectURL(file.raw);
},
————————————————
版权声明：本文为CSDN博主「小贵子的博客」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/zyg1515330502/article/details/123052970
