微信小程序点击图片预览-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 ...
随机推荐
- SQL-W3School-基础:SQL DISTINCT 语句
ylbtech-SQL-W3School-基础:SQL DISTINCT 语句 1.返回顶部 1. 本章讲解 SELECT DISTINCT 语句. SQL SELECT DISTINCT 语句 在表 ...
- Flask之加载静态资源
Flask之加载静态资源 1.加载css样式 <link rel="stylesheet" href="{{ url_for('static',filename=' ...
- 阶段5 3.微服务项目【学成在线】_day02 CMS前端开发_13-webpack研究-webpack入门程序
创建webpack测试的目录 定义webpack的入口文件 mdel01必须导出,main里面才能导入 导出多个 数组的写法 main是入口文件,里面已经引入了vue.min和model01.js ...
- 图解 HTTP 笔记(三)—— HTTP 报文内的 HTTP 信息
本章主要讲解请求和响应是如何运作的 一.HTTP 报文 用于 HTTP 协议交互的信息被称为 HTTP 报文,客户端的 HTTP 报文叫做请求报文,服务器端的叫做响应报文. HTTP 报文大致可分为报 ...
- 反射序列化字段的时候,需要添加[Datamember]不然会,忽略这个字段
反射序列化字段的时候,需要添加[Datamember]不然会,忽略这个字段
- Python实现的选择排序算法原理与用法实例分析
Python实现的选择排序算法原理与用法实例分析 这篇文章主要介绍了Python实现的选择排序算法,简单描述了选择排序的原理,并结合实例形式分析了Python实现与应用选择排序的具体操作技巧,需要的朋 ...
- ubuntu 18.04设置开机自动挂载移动硬盘
首先在命令行执行df -h指令,可以看到如下结果: zifeiy@zifeiy-PC1:~$ df -h 文件系统 容量 已用 可用 已用% 挂载点 udev 964M 0 964M 0% /dev ...
- iOS-保存图片到相册
//保存 UIButton *saveBtn = [[UIButton alloc] init]; // saveBtn.frame = CGRectMake((screenWi ...
- 《剑指offer》树专题 (牛客10.25)
考察的知识点主要在于树的数据结构(BST,AVL).遍历方式(前序,中序,后序,层次).遍历算法(DFS,BFS,回溯)以及遍历时借助的数据结构如队列和栈.由于树本身就是一个递归定义的结构,所以在递归 ...
- nginx passwd (http://www.voidcn.com/article/p-suebfyqy-nx.html)
操作系统CentOS 7.2 nignx 1.10.1 首先我们用Nginx提供HTTP的Basic Auth功能,配置了需要输入的用户名和密码,才能访问网站. 我们使用htpasswd来生成密码信息 ...