婚纱摄影网站论文,1688app,网页游戏设计培训学校,郑州又上热搜了需求#xff1a;上传限定比例的图片。前端框架是vue3 element plus。 问题#xff1a;使用vueCropper后比例固定。但是上传后的图片很模糊 vueCropper官网
解决办法
vueCropper中有一个full和high两个参数#xff0c;记得开启 const options: any reactive({img: , // 原… 需求上传限定比例的图片。前端框架是vue3 element plus。 问题使用vueCropper后比例固定。但是上传后的图片很模糊 vueCropper官网
解决办法
vueCropper中有一个full和high两个参数记得开启 const options: any reactive({img: , // 原图文件autoCrop: true, // 默认生成截图框fixedBox: false, // 固定截图框大小canMoveBox: true, // 截图框可以拖动fixed: true, // 截图框宽高固定比例fixedNumber: [4, 3], // 截图框的宽高比例centerBox: true, // 截图框被限制在图片里面canMove: true, // 上传图片不允许拖动canScale: true, // 上传图片不允许滚轮缩放full: true, //是否输出原图比例的截图high: true, //是否按照设备的dpr 输出等比例图片maxImgSize: 8000, //限制图片最大宽度和高度});顺便记录一下如何使用vueCropper //package.json中的版本vue-cropper: ^1.1.2,import { VueCropper } from vue-cropper;vueCropperclasscrop-boxrefcropper:imgoptions.img:autoCropoptions.autoCrop:fixedBoxoptions.fixedBox:canMoveBoxoptions.canMoveBox:centerBoxoptions.centerBox:fixedoptions.fixed:fixedNumberoptions.fixedNumber:canMoveoptions.canMove:canScaleoptions.canScale:fulloptions.full:highoptions.high/vueCropper
