<input type="file" id="id" name="image" class="getImgUrl_file" @change="shangc($event)" accept="image/jpg,image/jpeg,image/png">

通過:

let files = document.getElementById('id').files[0]

來獲取上傳的圖片資訊 在通過:

 let reader = new FileReader();
 reader.readAsDataURL(files)

將讀取到的圖片轉碼成Base64的一個字串,但需要擷取

        shangc(e){
            let files = document.getElementById('id').files[0]
            let name = document.getElementById('id').files[0].name
            let arr = name.split('.')
            console.log(arr);
            let fileSize = 0;
            let fileMaxSize = 10240;//1M
            if(files){
                fileSize =files.size;          
                if (fileSize > 10*1024*1024) {
                    alert("檔案大小不能大於10M！");
                    file.value = "";
                    return false;
                }else if (fileSize <= 0) {
                    alert("檔案大小不能為0M！");
                    file.value = "";
                    return false;
                }
            }else{
                return false;
            }

	   //轉碼base64
            let reader = new FileReader();
            let imgFile
            // let that = this
            reader.readAsDataURL(files)
            reader.onload = e => {
                imgFile = e.target.result;
                let arr = imgFile.split(',')
                this.datas.faceBase64 = arr[1]
                // console.log(imgFile)
                // console.log(this.datas.faceBase64)
            }
            
        },