uni-app----图片点击放大功能&&点击文本进行复制功能【安卓app端】

小小黑0072023-11-09 17:50

uni-app----图片点击放大功能&&点击文本进行复制功能【安卓app端】

1. 封装js文件

javascript 复制代码

// 图片点击放大效果
export function getimgPreview(imgList) {
	uni.previewImage({
		indicator: "number",
		loop: true,
		urls: imgList
	})
}

// 复制文本
export function setClipboardData(value) {
	uni.setClipboardData({
		data: value, //要被复制的内容
		success: () => {
			uni.showToast({ //提示
				title: '复制成功!'
			})
		}
	});
}

2. 进行调用

html 复制代码

<view class="marR20" v-for="(item,index) in infos.complete_images" :key="index" @click="imgPreview(infos.complete_images)">
<u--image :src="item" :width="width" :height="height" radius="12"></u--image>

<view class="color1C241E widP96" @click="clipboardData(infos.apply.address)">{{infos.apply.address}}</view>
</view>

javascript 复制代码

	import {
		getimgPreview,
		setClipboardData
	} from '@/until/actSheet_mapAPP.js';
	methods:{
		// 点击图片放大
		imgPreview(imgList) {
			getimgPreview(imgList)
		},
		// 文本复制
		clipboardData(val){
			setClipboardData(val)
		}
}