|
|
@@ -30,10 +30,10 @@ const option = ref({
|
|
|
info: true, //图片大小信息
|
|
|
canScale: true, //图片是否允许滚轮缩放
|
|
|
autoCrop: true, //是否默认生成截图框
|
|
|
- autoCropWidth: 150, //默认生成截图框宽度
|
|
|
- autoCropHeight: 150, //默认生成截图框高度
|
|
|
+ autoCropWidth: 460, //默认生成截图框宽度
|
|
|
+ autoCropHeight: 120, //默认生成截图框高度
|
|
|
fixed: true, //是否开启截图框宽高固定比例
|
|
|
- fixedNumber: [1, 1], //截图框的宽高比例
|
|
|
+ fixedNumber: [23, 6], //截图框的宽高比例
|
|
|
full: false, //false按原比例裁切图片，不失真
|
|
|
fixedBox: false, //固定截图框大小，不允许改变
|
|
|
canMove: false, //上传图片是否可以移动
|
|
|
@@ -44,7 +44,7 @@ const option = ref({
|
|
|
infoTrue: false, //true为展示真实输出图片宽高，false展示看到的截图框宽高
|
|
|
maxImgSize: 3000, //限制图片最大宽度和高度
|
|
|
enlarge: 1, //图片根据截图框输出比例倍数
|
|
|
- mode: '300px 300px' //图片默认渲染方式
|
|
|
+ mode: '460px 120px' //图片默认渲染方式
|
|
|
})
|
|
|
const previewURL = ref<string>('')
|
|
|
// 实时的刷新
|
|
|
@@ -153,7 +153,7 @@ const selectClick = () => {
|
|
|
<div class="w-[800px] h-[300px]">
|
|
|
<div class="w-[800px] h-[300px] flex items-center justify-between">
|
|
|
<!-- 给组件固定宽高 -->
|
|
|
- <div class="h-[300px] w-[510px]" style="width: 500px">
|
|
|
+ <div class="h-[180px] w-[690px]" style="width: 690px">
|
|
|
<VueCropper
|
|
|
ref="cropper"
|
|
|
:img="option.img"
|
