vue本地读取图片转码Base64

<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)
            }
            
        },