1.

 <div class="img-btn" v-show="!isUpload">
     <i class="iconfont icon-shouqi"></i>
     <span>上传照片</span>
 </div>
<img ref="imgimg" :src="imgUrl" alt="" v-show="isUpload">
<input ref="imgInput"  class="img-input" type="file" accept=".jpg,.gif,.png,.bmp" @change="uploadImg($event)">

2.

data () {
    return {
        isUpload:false,
        imgUrl:'',

 

3.

uploadImg(e){
    // console.log(e.target.files);
    this.isUpload=true;
    let file=e.target.files[0];
    let url='';
    var reader = new FileReader();
    reader.readAsDataURL(file);
    let that=this;
    reader.onload = function (e) {
        url=this.result.substring(this.result.indexOf(',')+1);
        that.imgUrl='data:image/png;base64,'+url
        // that.$refs['imgimg'].setAttribute('src','data:image/png;base64,'+url);
    }
},
Logo

前往低代码交流专区

更多推荐