37 lines
978 B
Vue
37 lines
978 B
Vue
|
<template>
|
|||
|
|
<view>
|
|||
|
|
<!-- https://ext.dcloud.net.cn/plugin?id=10333，文档在这里，自己看 -->
|
|||
|
|
<qf-image-cropper :src="src" :width="width" :height="height" :radius="0" @crop="handleCrop" />
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script setup>
|
|||
|
|
import {
|
|||
|
|
ref
|
|||
|
|
} from 'vue'
|
|||
|
|
import {
|
|||
|
|
onLoad
|
|||
|
|
} from '@dcloudio/uni-app';
|
|||
|
|
import QfImageCropper from '@/uni_modules/qf-image-cropper/components/qf-image-cropper/qf-image-cropper.vue'
|
|||
|
|
|
|||
|
|
// 图片源
|
|||
|
|
const src = ref('') // 可以根据需要动态设置图片路径
|
|||
|
|
const type = ref(0);
|
|||
|
|
const width = ref(600);
|
|||
|
|
const height = ref(400);
|
|||
|
|
// 裁剪完成的回调
|
|||
|
|
const handleCrop = (e) => {
|
|||
|
|
// console.log("剪切完了")
|
|||
|
|
uni.setStorageSync(`imgkey${type.value}`, e.tempFilePath);
|
|||
|
|
uni.navigateBack()
|
|||
|
|
}
|
|||
|
|
onLoad((options) => {
|
|||
|
|
src.value = options.url
|
|||
|
|
//type是一个页面有两个照相的时候做个类型区分
|
|||
|
|
type.value = options.type
|
|||
|
|
if(options.size){
|
|||
|
|
width.value = 900;
|
|||
|
|
height.value = 600;
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
</script>
|