cropper vue是一款基于vue.js的圖片裁剪插件。使用cropper vue可以輕松實現對圖片進行裁剪、縮放、旋轉等操作。該插件是對cropper.js插件的封裝，提供了更加簡潔易用的API接口，適合于集成到vue項目中使用。

要使用cropper vue，首先需要在項目中引入該插件的代碼庫。可以通過npm安裝cropper vue，并在vue組件中引入：

npm install cropper-vue --save
import 'cropper-vue/dist/cropper.css';
import Cropper from 'cropper-vue';
Vue.use(Cropper);

引入后，在vue組件內就可以使用<Cropper/>組件了：

<template>
<div id="app">
<Cropper
:src="imageUrl"
:options="options"
@crop="cropImage"
/>
</div>
</template>
<script>
export default {
data() {
return {
imageUrl: 'https://picsum.photos/800/800',
options: {
aspectRatio: 1,
autoCropArea: 0.5,
zoomable: false,
guides: false,
},
};
},
methods: {
cropImage(img) {
console.log(img);
},
},
};
</script>

在以上代碼中，<Cropper/>組件的:src屬性指定要裁剪的圖片地址，:options屬性用于配置cropper的選項，@crop事件將在裁剪完成后觸發，返回裁剪結果數據。

cropper vue提供的選項非常豐富，可用于控制裁剪框的尺寸、比例、位置以及圖片的縮放、旋轉等操作。更多關于cropper vue的API和選項請參閱官方文檔。