vue-cropper 一键设置图片的缩放比例、位置

一键设置图片的缩放比例、位置

Open julin69 opened this issue 2 years ago • 4 comments

你好，我现在有一个功能，页面效果如下 QQ截图20230322163029

我想实现的是当点击下面第一个按钮时，效果变成图片最长边完整填充到裁剪框中，短边部分会有空白，如下图 QQ截图20230322163708

当点击下面第2个按钮时，效果变成最短边完全填充到裁剪框中，长边部分两边超出，如下图所示 QQ截图20230322163257

怎么动态设置图片的缩放比例和位置呢？谢谢！

Mar 22 '23 08:03 julin69

你可以设置图片的 mode 形式，比如 mode: cover , mode: 400px 300px, 之类的来控制图片的渲染，类似 background-size 的展示形式

Mar 22 '23 08:03 xyxiao001

有方法可以改变这个mode吗，可以任意切换mode

Mar 22 '23 08:03 julin69

而且，mode是相对与容器外面的元素节点的，不是相对与裁剪框的当我设置mode为cover时，效果是这样的：

我想要的不是这种，我要的是填充到裁剪框里面去

Mar 22 '23 08:03 julin69

目前是不支持裁剪框的填充

Mar 22 '23 09:03 xyxiao001