|
@@ -57,18 +57,19 @@
|
|
|
default: '360px',
|
|
|
},
|
|
|
crossorigin: {
|
|
|
- type: String,
|
|
|
+ type: String as PropType<'' | 'anonymous' | 'use-credentials' | undefined>,
|
|
|
default: undefined,
|
|
|
},
|
|
|
imageStyle: {
|
|
|
type: Object as PropType<CSSProperties>,
|
|
|
- default: {},
|
|
|
+ default: () => {},
|
|
|
},
|
|
|
options: {
|
|
|
type: Object as PropType<Options>,
|
|
|
- default: {},
|
|
|
+ default: () => {},
|
|
|
},
|
|
|
},
|
|
|
+ emits: ['cropperedInfo'],
|
|
|
setup(props, ctx) {
|
|
|
const imgElRef = ref<ElRef<HTMLImageElement>>(null);
|
|
|
const cropper: any = ref<Nullable<Cropper>>(null);
|
|
@@ -109,17 +110,17 @@
|
|
|
// event: return base64 and width and height information after cropping
|
|
|
const croppered = (): void => {
|
|
|
let imgInfo = cropper.value.getData();
|
|
|
- cropper.value.getCroppedCanvas().toBlob(blob => {
|
|
|
- let fileReader: FileReader = new FileReader()
|
|
|
+ cropper.value.getCroppedCanvas().toBlob((blob) => {
|
|
|
+ let fileReader: FileReader = new FileReader();
|
|
|
fileReader.onloadend = (e: any) => {
|
|
|
- ctx.emit("cropperedInfo", {
|
|
|
+ ctx.emit('cropperedInfo', {
|
|
|
imgBase64: e.target.result,
|
|
|
- imgInfo
|
|
|
- })
|
|
|
- }
|
|
|
- fileReader.readAsDataURL(blob)
|
|
|
- }, 'image/jpeg')
|
|
|
- }
|
|
|
+ imgInfo,
|
|
|
+ });
|
|
|
+ };
|
|
|
+ fileReader.readAsDataURL(blob);
|
|
|
+ }, 'image/jpeg');
|
|
|
+ };
|
|
|
|
|
|
onMounted(init);
|
|
|
|