lrz：图片压缩上传

lrz图片压缩

npm install lrz
// main.js引入
import lrz from 'lrz'

<input type="file" @change="upfileimg($event)">
//上传图片
methods:{
	upfileimg(e) {
	    this.$toast.loading({ duration: 0, forbidClick: true, mask: false, message: '图片上传中', });
	    let file = e.target.files[0];
	    // 图片开始压缩，获得压缩后的rst参数
	    lrz(file, { quality: 0.3 }).then(rst => {
	        this.$toast.clear();
	        let userfile = this.upfile(rst.base64, rst.origin.name);//调用自己的upfile方法吧压缩后的base64转二进制
	        let formdata = new FormData();
	        formdata.append('img', userfile);
	        this.axios.post('api/ucenter/edit_pic', formdata).then(res => {
	            if (res.status == 1) {
	                this.userimg = res.data.img;
	                this.$toast('头像上传成功')
	                e.target.value = '';//重置一遍value,至关重要，防止第二次上传相同图片，或者取消上传报错
	            }
	        })
	    });
	},
	
	/*将base64转换为file*/
	dataURLtoFile(dataurl, filename) { //将base64转换为文件
	    var arr = dataurl.split(','),
	        mime = arr[0].match(/:(.*?);/)[1],
	        bstr = atob(arr[1]),
	        n = bstr.length,
	        u8arr = new Uint8Array(n);
	    while (n--) {
	        u8arr[n] = bstr.charCodeAt(n);
	    }
	    return new File([u8arr], filename, {
	        type: mime
	    });
	}
}

图片上传成功重置一遍value至关重要，防止第二次上传相同图片，或者取消上传报错