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

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)
		}
}
相关推荐
web守墓人44 分钟前
【前端】ikun-markdown: 纯js实现markdown到富文本html的转换库
前端·javascript·html
为风而战1 小时前
uni-app X APP在线升级 解决【uni-upgrade-center-app】未配置uni-upgrade-center 问题
uni-app
Savior`L1 小时前
CSS知识复习5
前端·css
许白掰1 小时前
Linux入门篇学习——Linux 工具之 make 工具和 makefile 文件
linux·运维·服务器·前端·学习·编辑器
雪碧聊技术5 小时前
uniapp如何创建并使用组件?组件通过Props如何进行数据传递?
uni-app·创建组件·使用组件·props数据传递
中微子5 小时前
🔥 React Context 面试必考!从源码到实战的完整攻略 | 99%的人都不知道的性能陷阱
前端·react.js
@Dream_Chaser5 小时前
uniapp页面间通信
uni-app
中微子6 小时前
React 状态管理 源码深度解析
前端·react.js
加减法原则7 小时前
Vue3 组合式函数:让你的代码复用如丝般顺滑
前端·vue.js
爬虫程序猿8 小时前
利用爬虫按关键字搜索淘宝商品实战指南
android·爬虫