vue上传头像显示在页面中base64

body部分

<img src="" style="height: 60px; width: 60px;" id="portrait">
      <div class="logo">
        点击上传头像        
        <input type="file" class="shangchuan" id="saveImage">
      </div>

methods部分

  great: function() {
      document.getElementById("saveImage").onchange = function() {
        console.log(1);
        var imgFile = this.files[0];
        var fr = new FileReader();
        fr.onload = function() {
          document.getElementById("portrait").src = fr.result;
          this.src = fr.result;
           console.log(this.src)
        };
        fr.readAsDataURL(imgFile);
        console.log(imgFile)
      };
    },

mouted调用

 mounted: function() {
    this.$nextTick(function() {
      // Code that will run only after the
      // entire view has been rendered
      this.great();
    });
  },

猜你喜欢

转载自blog.csdn.net/weixin_43195512/article/details/84253759