vue element-ui之图片上传el-upload

一、组件布局部分


       
       

二、js的methods部分(需要注意的是,file名是固定的,为后台的文件或图片名称,不能更改)

            //    图片上传
            handleAvatarSuccess(res,file) {
                this.imageUrl = URL.createObjectURL(file.raw);
                this.formEdit.e_icon = res.data[0].e_icon
            },
            beforeAvatarUpload(file) {
                const isJPG = file.type === 'image/jpeg';
                const isLt2M = file.size / 1024 / 1024 < 2;

                if (!isJPG) {
                    this.$message.error('上传头像图片只能是 JPG 格式!');
                }
                if (!isLt2M) {
                    this.$message.error('上传头像图片大小不能超过 2MB!');
                }
                return isJPG && isLt2M;
            }

你可能感兴趣的:(vue element-ui之图片上传el-upload)