今天介绍的是一款用于裁剪图片的插件的使用，个人使用了觉得算挺方便的一款插件；vue-image-cutter
先看效果图
TIM图片20200106170151.png
TIM图片20200106170222.png
安装
npm install vue-img-cutter --save-dev
//或者淘宝镜像
cnpm install vue-img-cutter --save-dev
页面引入
import ImgCutter from 'vue-img-cutter'
export default {
components:{
ImgCutter
},
}
这是我的配置
//html部分
<ImgCutter
:boxWidth="800"
:boxHeight="400"
:cutWidth="450"
:cutHeight="240"
:sizeChange="false"
v-on:cutDown="cutDown"
></ImgCutter>
//方法部分
cutDown: function (res) {
let imgSrc = res.dataURL;
console.log(imgSrc);//输出为base64数据
},
网友评论