utils文件里面增加：
/**
* 用于图片上传时校验图片的宽高
* @param file file对象
* @param width 规定的图片宽度
* @param height 规定的图片高度
*/
export function imgSize(context,file, width, height) {
let ruleWidth = width
let ruleHeight = height
const isSize = new Promise((resolve, reject) => {
let url = window.URL || window.webkitURL
let img = new Image()
img.onload = function () {
// 图片比例校验
let valid = img.width === ruleWidth && img.height === ruleHeight
console.log(valid,'valid...')
valid ? resolve() : reject(new Error('error..'))
}
img.src = url.createObjectURL(file)
}).then(
() => {
return file
},
() => {
context.$message.error({
message: `上传文件的图片大小不符合标准,宽需要为${ruleWidth}px，高需要为${ruleHeight}px`,
btn: false
})
return Promise.reject(new Error('error..'))
}
)
return isSize
}
使用：
import { imgSize } from '@utils/common'
// 上传前限制
beforeUpload(file) {
console.log(file,'file...')
const isSize = imgSize(this, file, 150, 150)
const isJPG = file.type === 'image/jpeg' || file.type === 'image/png'
const isLimit = file.size / 1024 <= 500
!isJPG && this.$message.error('上传的图片接受JPG，PNG格式')
!isLimit && this.$message.error('上传的图片大小不能超过 500KB!')
return isJPG && isLimit && isSize
},
