input file 上传文件限制文件大小和格式

单个图片判断文件大小和正确的格式

<input type="file" class="face" accept="image/*" @change="getPhoto($event)" ref="picture">
export default { name: "PhotoBox", data(){ return{ imgUrl: "", } }, methods:{ getPhoto(event){ console.log(event.target) // console.log(event.target.value)//C:\fakepath\ban1.jpg let file = event.target.files[0]; console.log(file) console.log(file.size) console.log(file.type) // let SuffixName = file.type.indexOf("png"); let flag = file.type.indexOf("jpg")>0 && file.type.indexOf("png")>0 && file.type.indexOf("jpeg")>0 if (flag) { console.log('请上传正确格式的图片') }
if (event.target.files[0].size > 1*1024*1024) { // 此处判断上传文件的大小 , 单位为 b 故要乘以两个1024 console.log('图片最大为1兆') }
// let url = ""; // // let reader = new FileReader(); // reader.readAsDataURL(file); // let that = this; // reader.onload = function(e) { // url = this.result.substring(this.result.indexOf(",") + 1); // that.imgUrl = "data:image/png;base64," + url; // };
} }}

判断图片大小

let flag = file.type.indexOf("jpg")>0 && file.type.indexOf("png")>0 && file.type.indexOf("jpeg")>0if (flag) { console.log('请上传正确格式的图片')}

判断图片格式

if (event.target.files[0].size > 1*1024*1024) { // 此处判断上传文件的大小 , 单位为 b 故要乘以两个1024 console.log('图片最大为1兆')}

input file 上传文件限制文件大小和格式》来自互联网,仅为收藏学习,如侵权请联系删除。本文URL:https://www.hashtobe.com/1020.html