vue-crpopper
一个优雅的图片裁剪插件
预览
安装
npm install vue-cropper
使用
import VueCropper from vue-cropper
<vueCropper
ref="cropper"
:img="option.img"
:outputSize="option.size"
:outputType="option.outputType"
></vueCropper>
| 名称 |
功能 |
默认值 |
可选值 |
| img |
裁剪图片的地址 |
空 |
url 地址 || base64 || blob |
| outputSize |
裁剪生成图片的质量 |
1 |
0.1 - 1 |
| outputType |
裁剪生成图片的格式 |
jpg (jpg 需要传入jpeg) |
jpeg || png || web |
内置方法
通过this.$refs.cropper 调用
this.$refs.cropper.startCrop()
开始截图
this.$refs.cropper.stopCrop()
停止截图
this.$refs.cropper.clearCrop()
清除截图
this.$refs.cropper.getCropDate()
获取截图信息
