vue前端以base64的图片显示
action属性值为"#"增加了:http-request="httpRequest"方法解释:http-request覆盖默认的上传行为,可以自定义上传的实现<el-uploadclass="avatar-uploader"action="#":http-request="httpRequest":show-f...
·
action属性值为"#"
增加了:http-request="httpRequest"方法
解释:
http-request 覆盖默认的上传行为,可以自定义上传的实现
<el-upload
class="avatar-uploader"
action="#"
:http-request="httpRequest"
:show-file-list="false"
:before-upload="beforeAvatarUpload">
<img v-if="data.imageUrl" :src="data.imageUrl" class="avatar">
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
httpRequest方法主要处理显示缩略图,并且将需要用到的file转换成base64的文件格式
httpRequest (data) {
let _this = this
let rd = new FileReader() // 创建文件读取对象
let file = data.file
rd.readAsDataURL(file) // 文件读取装换为base64类型
rd.onloadend = function (e) {
_this.data.imageUrl = this.result // this指向当前方法onloadend的作用域
}
}
主要是读取你选中的图片,然后显示!
更多推荐
已为社区贡献1条内容
所有评论(0)