vue中选择图片,预览图片,返回base64

1.html内容
<el-col :span="20" style="margin-left: 100px;">
<input type="file" name="avatar" accept="image/gif,image/jpeg,image/jpg,image/png" @change="changeCoverImg($event)">
<img :src="coverImg">
</el-col>
2.data中声明变量
  coverImg:'',
3.methods中方法
changeCoverImg:function(e) {
var file = e.target.files[0]
var reader = new FileReader()
var that = this
reader.readAsDataURL(file)
reader.onload = function(e) {
that.coverImg = this.result
// console.log(that.coverImg)
}
},
4.效果图

 返回的base64:



 

猜你喜欢

转载自www.cnblogs.com/szqtiger/p/12100754.html