uni-app 小程序:显示图片并且点击图片展示大图

效果如图所示:

在页面显示一张图片,然后点击该张图片后显示大图。点击大图就可以关闭大图。

实现的主要代码如下:

<image :src="imgpath" mode="aspectFill" @click="imgPreview(imgArr)"></image>

其中imgpath为图片路径,imgArr为图片路径组成的数组。

图片预览的方法如下:

imgPreview(url) {

uni.previewImage({

indicator: "none",

loop: false,

urls: url,

})

},

以上方法就是小程序实现点击小图查看大图的方法了。

相关推荐
软工的小白1 小时前
uniapp开发前端静态视频界面+如何将本地视频转换成网络地址
uni-app·音视频
程序员陆通2 小时前
用 Cursor AI 快速开发你的第一个编程小程序
人工智能·小程序
鹧鸪云光伏与储能软件开发3 小时前
投资储能项目能赚多少钱?小程序帮你测算
运维·数据库·小程序·光伏·光伏设计软件·光伏设计
微三云-轩3 小时前
小程序:12亿用户的入口,企业数字化的先锋军
大数据·小程序·开源软件
低代码布道师3 小时前
少儿舞蹈小程序(8)校区信息后台搭建
低代码·小程序
2501_916008893 小时前
iOS 抓包工具有哪些?全面盘点主流工具与功能对比分析
android·ios·小程序·https·uni-app·iphone·webview
2501_915921433 小时前
iOS混淆工具实战 视频流媒体类 App 的版权与播放安全保护
android·ios·小程序·https·uni-app·iphone·webview
NewChapter °4 小时前
如何通过 Gitee API 上传文件到指定仓库
前端·vue.js·gitee·uni-app
SY_FC6 小时前
uniapp阿里云验证码使用
阿里云·uni-app·notepad++
—Qeyser7 小时前
好看的背景颜色 uniapp+小程序
小程序·uni-app·uniapp·微信小游戏