vue3+ts 中实现压缩图片、blob 转 base64

压缩图片

1.npm 安装 image-compressor.js

2.引入 import ImageCompressor from 'image-compressor.js'

3.使用

const compressImage = async (file: any) => {var imageCompressor = new ImageCompressor()return new Promise((resolve, reject) => {imageCompressor.compress(file, { quality: 0.8, maxHeight: 100, maxWidth: 100 }).then((result) => {resolve(result)}).catch((err) => {reject(err)})})
}// 这个方法是异步的，使用时记得
const afterRead = async (res: any) => {let file = await compressImage(files)
}

blob 转 base64，（同样也是异步的）

const blobToBase64 = (blob: any) => {return new Promise((resolve, reject) => {const reader = new FileReader()reader.onloadend = () => {resolve(reader.result)}reader.onerror = rejectreader.readAsDataURL(blob)})
}