import compress from '@/utils/compress'
import imgSize from '@/utils/imgSize
async handleUpload(data) {
const file = data.file
// 原来的
const form = new FormData()
form.append('file', file)
File.upload(form)
.then(response => {
console.log(response)
this.file = response.data
})
.catch(error => {
console.error(error)
})
},
// demo如果图片不转base64
// imgSize(file).then(() => {
// compress(file, 100).then((res) => {
// const form = new FormData()
// form.set('file', res)
// File.upload(form)
// .then(response => {
// console.log(response)
// this.file = response.data
// })
// .catch(error => {
// console.error(error)
// })
// })
// }).catch(() => {})
// demo如果图片转base64
// imgSize(file).then(() => {
// compress(file, 100).then((res) => {
// const reader = new FileReader()
// reader.readAsDataURL(res)
// reader.onload = (e) => {
// console.log(e)
// // 读取到的图片base64 数据编码 在此编码字符串传给后台即可
// let param = {
// base64:e.target.result
// }
// // 以下上传
// 接口.(param)
// }
// console.log(ocrImgStr)
// const form = new FormData()
// form.set('file', res)
// File.upload(form)
// .then(response => {
// console.log(response)
// this.file = response.data
// })
// .catch(error => {
// console.error(error)
// })
// })
// }).catch(() => {})
compress.js
import * as imageConversion from 'image-conversion'
export default async function (file,size){
let blob = null
await imageConversion.compressAccurately(file, size).then(res => {
blob = res
})
const resAvatarFile = new window.File(
[blob],
file.name,
{ type: file.type }
)
return resAvatarFile
}
imgSize.js
import { Message } from 'element-ui'
export default function (file) {
return new Promise((resolve, reject) => {
const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png'
const isLt2M = file.size / 1024 / 1024 < 2
if (!isJpgOrPng) {
reject(
Message({
message: '上传图片只能是 JPG 或 PNG 格式',
type: 'error'
})
)
}
if (!isLt2M) {
reject(
Message({
message: '上传头像图片大小不能超过 2MB!',
type: 'error'
})
)
}
resolve()
})
}
