1. 程式人生 > >vue點選選中圖片並以base64格式傳向後臺

vue點選選中圖片並以base64格式傳向後臺

input標籤中的寫法

<input type='file' class="uploadphoto" @change="uploadphoto($event)" ref="inputer" multiple accept="image/png,image/jpeg,image/gif,image/jpg">

函式中的寫法

  methods:{
      uploadphoto(e){
      var file = e.target.files[0];
      var filesize = file.size;
      var filename = file.name;
      // 2,621,440   2M
      if (filesize > 2101440) {
          // 圖片大於2MB
  
      }
      var reader = new FileReader();
      reader.readAsDataURL(file);
      reader.onload = function (e) {
  
          // 讀取到的圖片base64 資料編碼 將此編碼字串傳給後臺即可
          var imgcode = e.target.result;
          console.log(imgcode);
      }
    }
  },