1. 程式人生 > >el-upload怎麽拿到上傳的圖片的base64格式

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

size create asd label 格式 small 技術 else result

這裏只是本地上傳,拿圖片的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; } }

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

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