更新记录
1.1.0(2021-12-09) 下载此版本
图片预览(使用简单) 可以双指缩放 可以保存分享
平台兼容性
Vue2 | Vue3 |
---|---|
√ | × |
App | 快应用 | 微信小程序 | 支付宝小程序 | 百度小程序 | 字节小程序 | QQ小程序 |
---|---|---|---|---|---|---|
HBuilderX 3.0.0 app-vue app-nvue | × | √ | × | × | × | × |
钉钉小程序 | 快手小程序 | 飞书小程序 | 京东小程序 |
---|---|---|---|
× | × | × | × |
H5-Safari | Android Browser | 微信浏览器(Android) | QQ浏览器(Android) | Chrome | IE | Edge | Firefox | PC-Safari |
---|---|---|---|---|---|---|---|---|
√ | √ | √ | √ | √ | × | √ | √ | √ |
showimg使用说明
长按可以弹出菜单(保存图片不支持h5)
-
下载压缩包并解压到页面目录中
-
在pages.json中添加页面
{ "path": "pages/showimg/showimg", "style": { "navigationBarTextStyle":"white", "app-plus":{ "animationType":"fade-in", "animationDuration":300 } } }
3.跳转到页面并传递参数
imgs为图片列表 本地路径和网络路径均可
current为索引
uni.navigateTo({
url: '/pages/showimg/showimg?imgs=' + JSON.stringify(imgs) + '¤t=' +current,
animationType: "fade-in",
})
可以封装在Vue.prototype中
//main.js
Vue.prototype.$showimg = function (data) {
uni.navigateTo({
url: '/pages/showimg/showimg?imgs=' + JSON.stringify(data.imgs) + '¤t=' + data.current,
animationType: "fade-in",
})
}