vant上傳圖片，有圖片的寬高大小限制，可以上傳時壓縮圖片，在這里記錄一下。

壓縮圖片大小

afterRead(file){console.log(file,'0000')this.face = [];let canvas = document.createElement('canvas') // 創建Canvas對象(畫布)let context = canvas.getContext('2d')let img = new Image()img.src = file.content // 指定圖片的DataURL(圖片的base64編碼數據)img.onload = () => {canvas.width = img.width/10canvas.height = img.height/10context.drawImage(img, 0, 0, img.width/10, img.height/10)file.content = canvas.toDataURL(file.file.type, 0.92) // 0.92為默認壓縮質量console.log(file,file.content,'4444444')let files = this.dataURLtoFile(file.content, file.file.name)console.log(files,'33333')this.uploadToqiniu(files,this.face);}},

講base64轉換為file文件

dataURLtoFile (dataurl, filename) { // 將base64轉換為file文件let arr = dataurl.split(',')let mime = arr[0].match(/:(.*?);/)[1]let bstr = atob(arr[1])let n = bstr.lengthlet u8arr = new Uint8Array(n)while (n--) {u8arr[n] = bstr.charCodeAt(n)}return new File([u8arr], filename, {type: mime})},

總結

以上是生活随笔為你收集整理的vant上传图片时压缩图片的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。