liaotian/pages/index/cropper.vue

<template>
	<view>
		<ksp-cropper mode="fixed" :width="minPicWidth" :height="minPicHeight" :maxWidth="1024" :maxHeight="1024"
			:url="url" @cancel="oncancel" @ok="uploadSuccess"></ksp-cropper>
	</view>
</template>

<script>
    import kspCropper from '@/uni_modules/ksp-cropper/components/ksp-cropper/ksp-cropper.vue'
	export default {
        components: {
            kspCropper
        },
		data() {
			return {
				// 保存触发事件
				eventChannel: '',
				minPicWidth: 100, //保存图片最小宽
				minPicHeight: 100, //保存图片最小高
				url: '' //图片

			}
		},
		onLoad(opt) {
			const that = this;
			if (opt.width) {
				that.minPicWidth = +opt.width;
			}
			if (opt.height) {
				that.minPicHeight = +opt.height;
			}
			// #ifdef APP-NVUE
			that.eventChannel = that.$scope.eventChannel; // 兼容APP-NVUE
			// #endif
			// #ifndef APP-NVUE
			that.eventChannel = that.getOpenerEventChannel();
			// #endif
			that.eventChannel.on('urlNext', function(data) {
				that.url = data.url;
			})
		},
		methods: {
			oncancel(e) {
				uni.navigateBack();
				console.log(e, 'on');
			},
			// 3.定义自己的回调函数
			uploadSuccess(tempFilePath) {
				console.log(tempFilePath,'tempFilePath')
				this.eventChannel.emit('uploadSuccess', tempFilePath.path);
				// 后退回原来的页面
				uni.navigateBack();
			},

		}
	}
</script>
<style>
</style>