|  |  | 
 |  |  |               :canMove="options.canMove" | 
 |  |  |               :output-size="options.outputSize" | 
 |  |  |               :centerBox="options.centerBox" | 
 |  |  |               :autoCropWidth="options.autoCropWidth" | 
 |  |  |               :autoCropHeight="options.autoCropHeight" | 
 |  |  |               :autoCropWidth="autoCrop.width || options.autoCropWidth" | 
 |  |  |               :autoCropHeight="autoCrop.height || options.autoCropHeight" | 
 |  |  |               @realTime="realTime" | 
 |  |  |           ></vue-cropper> | 
 |  |  |         </div> | 
 |  |  | 
 |  |  |  | 
 |  |  | <script> | 
 |  |  | import { VueCropper } from 'vue-cropper' | 
 |  |  | import {upload} from "@/api/system/common"; | 
 |  |  | import { upload } from '@/api/system/common' | 
 |  |  | export default { | 
 |  |  |   name: 'ImageCropper', | 
 |  |  |   components: { VueCropper }, | 
 |  |  | 
 |  |  |     imgSrc: { | 
 |  |  |       type: String, | 
 |  |  |       default: '' | 
 |  |  |     }, | 
 |  |  |     autoCrop: { | 
 |  |  |       type: Object, | 
 |  |  |       default () { | 
 |  |  |         return { width: 500, height: 500 } | 
 |  |  |       } | 
 |  |  |     }, | 
 |  |  |     // 回显上次保存的截图的位置 | 
 |  |  |     location: { | 
 |  |  | 
 |  |  |         centerBox: true, | 
 |  |  |         height: 500, | 
 |  |  |         width: 500, | 
 |  |  |         outputSize:{width: 500, height: 500 }, | 
 |  |  |         outputSize: 1, | 
 |  |  |         autoCropWidth: 500, | 
 |  |  |         autoCropHeight: 500, | 
 |  |  |         fixed: true, | 
 |  |  | 
 |  |  |   watch: { | 
 |  |  |   }, | 
 |  |  |   methods: { | 
 |  |  |     getImagecropper(){ | 
 |  |  |     getImagecropper () { | 
 |  |  |       return this.$refs.cropper | 
 |  |  |     }, | 
 |  |  |     // 学习截图框变化事件 |