微信小程序点击图片预览-wx.previewImage
<view class='imgList'>
<view class='imgList-li' wx:for='{{imgArr}}'>
<image class='img' src='{{item}}' data-index='{{index}}' bindtap='previewImg'></image>
</view>
</view>
Page({ /**
* 页面的初始数据
*/
data: {
imgArr:[
'http://bpic.jpg',
'http://bpic.jpg',
'http://bpic.jpg',
'http://bpic.jpg'
]
},
previewImg:function(e){
let _this = this
//图片预览
wx.previewImage({
current:_this.imgArr[0] , // 当前显示图片的http链接
urls: _this.imgList // 需要预览的图片http链接列表
})
} })
微信小程序点击图片预览-wx.previewImage的更多相关文章
- 微信小程序-点击图片预览
拿接口 有封装 封装查看另外的博文 点击动作 WXHTML 注意 data-xxxx自定义属性 这样知道我点的是哪个参数
- 微信小程序开发之图片预览
实现图片的展示和大图预览 使用wx.previewImage(OBJECT)来实现 OBJECT参数说明: 参数 类型 必填 说明 current String 否 当前显示图片的链接,不填则默认为 ...
- 微信小程序——网盘图片预览
微信小程序图片预览提供了一个wx.previewImage接口,如下图: 现在我需要对网盘文件里的图片预览,但是网盘从后台返回的数据是各种类型的文件,如下图所示: 那么我们需要解决2个问题: 1.从这 ...
- 微信小程序点击图片放大预览
微信小程序点击图片放大预览使用到 wx.previewImage 接口,可以放大.上/下一张 上代码 wxml代码 <view class='content-img' wx:if="{ ...
- 小程序图片预览 wx.previewImage
list: [ 'http://img5.imgtn.bdimg.com/it/u=3300305952,1328708913&fm=26&gp=0.jpg', 'http://i ...
- 微信小程序(组件demo)以及预览方法:(小程序交流群:604788754)
1. 获取微信小程序的 AppID 登录 https://mp.weixin.qq.com ,就可以在网站的"设置"-"开发者设置"中,查看到微信小程序的 Ap ...
- 【微信小程序】--bindtap参数传递,配合wx.previewImage实现多张缩略图预览
本文为原创随笔,纯属个人理解.如有错误,欢迎指出. 如需转载请注明出处 在微信小程序中预览图片分为 a.预览本地相册中的图片. b.预览某个wxml中的多张图片. 分析:实质其实是一样的.都是给wx. ...
- 微信小程序点击图片全屏
作为一个只懂简单HTML,jQuery,JS的web后台开发者,最近在学习小程序开发,现在将小程序的点击全屏功能的相关内容记录下来.如果有不对的地方或者有更简单的方法,请留言指教 0_0~ .js 文 ...
- 小程序 canvas实现图片预览,图片保存
wxml 代码: <view class="result-page"> <canvas bindtap="previewImage" canv ...
随机推荐
- ForkJoinPool 源码分析
ForkJoinPool ForkJoinPool 是一个运行 ForkJoinTask 任务.支持工作窃取和并行计算的线程池 核心参数+创建实例 // 工作者线程驻留任务队列索引位 static f ...
- Qt编写自定义控件21-圆弧仪表盘
一.前言 圆弧仪表盘在整个自定义控件大全中也稍微遇到了技术难点,比如背景透明,如果采用以前画圆形画扇形的方式绘制,肯定很难形成背景透明,需要用到切割,最后换了一种绘制方法,采用绘制圆弧的方式,即使用d ...
- PAT 甲级 1015 Reversible Primes (20 分) (进制转换和素数判断(错因为忘了=))
1015 Reversible Primes (20 分) A reversible prime in any number system is a prime whose "rever ...
- Centos6.5搭建方法
# VSFTP # ## ###安装 vsftp yum install vsftpd* -y ###启动服务 /etc/init.d/vsftpd restart ###配置 ...
- 【FFMPEG】Windows下使用Visual Studio 2010编译ffmpeg全过程
原文 http://www.cnblogs.com/xylc/p/3683203.html 主题 FFmpegWindowsVisual Studio ffmpeg是一个开源的多媒体库,使用非常广泛 ...
- [转帖]phoronix-test-suite测试云服务器
phoronix-test-suite测试云服务器 https://www.cnblogs.com/tanyongli/p/7767804.html centos系统 phoronix-test-su ...
- postgresSQL常用命令
1.createdb 数据库名称 产生数据库2.dropdb 数据库名称 删除数据库 3.CREATE USER 用户名称 创建用户4.drop User 用户名称 删除用户 5.SELEC ...
- SpreadJS:一款高度类似Excel的开发工具,功能涵盖Excel的 95% 以上
Excel 作为一款深受用户喜爱的电子表格工具,借助其直观的界面.出色的计算性能.数据分析和图表,已经成为数据统计领域不可或缺的软件之一. 基于Excel对数据处理与分析的卓越表现,把Excel的功能 ...
- ibox 的使用
<div class="ibox float-e-margins"> <div class="ibox-title"> <h5&g ...
- SQL SERVER导入EXCEL文件:无法创建链接服务器 "(null)" 的 OLE DB 访问接口 "Microsoft.Ace.OLEDB.12.0" 的实例。
[方法一] --开启导入功能 exec sp_configure 'show advanced options',1 reconfigure exec sp_configure 'A ...