el-upload怎么拿到上傳的圖片的base64格式


這里只是本地上傳,拿圖片的base64,並不向后台直接上傳,拿到base64后手動上傳

上傳前效果:

上傳后效果:

 

 .vue

       <el-form-item label="禮品封面">
              <el-upload
                class="avatar-uploader"
                action=""
                :show-file-list="false"
                :auto-upload="false"
                :on-change="changeFile">
                <img id="giftImg" v-if="imageUrl" :src="imageUrl" class="avatar">
                <el-button v-else slot="trigger" size="small" type="primary">選取文件</el-button>
              </el-upload>
            </el-form-item>

 

.ts

  changeFile(file, fileList) {
    var This = this;
    //this.imageUrl = URL.createObjectURL(file.raw);
    var reader = new FileReader();
    reader.readAsDataURL(file.raw);
    reader.onload = function(e){ 
        this.result // 這個就是base64編碼了
        This.imageUrl = this.result;
    }
  }

 

 有些東西就是試出來的,然后總結,~~~

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM