1. 程式人生 > 實用技巧 >使用element檔案上傳圖片轉base64位元組傳到伺服器

使用element檔案上傳圖片轉base64位元組傳到伺服器

beforeUpload (file) {
  var _this = this;
  var reader = new FileReader();
  reader.readAsDataURL(file);
  reader.onload = function(e) {
    // 圖片base64化
    var newUrl = this.result;    //圖片路徑
    _this.imgUrl = newUrl;
  };
},

  或者 不使用element-ui中 upload的自動上傳的話 可以在on-change事件裡面 轉換成base64的路徑

handleChange (file, fileList, item) {
    this.getBase64(file.raw).then(res => {
        console.log(res);
    });
},
getBase64(file) {
    return new Promise(function(resolve, reject) {
        let reader = new FileReader();
        let imgResult = "";
        reader.readAsDataURL(file);
        reader.onload = function() {
            imgResult = reader.result;
        };
        reader.onerror = function(error) {
            reject(error);
        };
        reader.onloadend = function() {
            resolve(imgResult);
        };
    });
},
 
//handleChange中  item是我的自定義引數