小程序图片预览 wx.previewImage
- list: [
- 'http://img5.imgtn.bdimg.com/it/u=3300305952,1328708913&fm=26&gp=0.jpg',
- 'http://img.52z.com/upload/news/image/20180312/20180312060838_67790.jpg',
- ],
- // 如果用了wepy的话
- <swiper-item v-for="item in list">
- <image :src="item" class="slide-image" data-list="{{list}}" data-src="{{item}}" style="width:100%; height:276rpx;" @tap="previewImage"/>
- </swiper-item>
- // 原始小程序 data-list : 所有预览图片; data-src: 当前预览图片
- <swiper-item wx:for="{{list}}" wx:for-item="item">
- <image :src="item" class="slide-image" data-list="{{list}}" data-src="{{item}}" style="width:100%; height:276rpx;" @tap="previewImage"/>
- </swiper-item>
- methods: {
- previewImage: function (e) {
- var src = e.currentTarget.dataset.src; // 获取data-src
- var imgList = e.currentTarget.dataset.list; // 获取data-list
- wx.previewImage({
- current: src, // 当前显示图片的http链接
- urls: imgList, // 需要预览的图片http链接列表
- success: function(res) {
- console.log('success');
- },
- fail: function(res) {
- console.log('fail');
- },
- })
- }
- },
- wx.previewImage 不支持本地图片预览,只支持http或https链接图片
小程序图片预览 wx.previewImage的更多相关文章
- 微信小程序点击图片预览-wx.previewImage
<view class='imgList'> <view class='imgList-li' wx:for='{{imgArr}}'> <image class='im ...
- 微信小程序-图片预览
仅供参考: 1,wxml: <view class="foot" bindtap="previewImage">我的小程序码</view> ...
- TODO:小程序手机预览调试
TODO:小程序手机预览调试 1. 小程序注册,目前还未开通个人注册,主体类型为企业.政府.媒体.其他组织 2. 登录小程序,绑定开发者,获取AppID 3. 下载微信小程序示例-新片预告 https ...
- Wx-小程序-图片预览、保存
点击图片预览 长按图片保存 点击按钮保存到手机相册 view: <!--wxml--> <text>点击图片预览.长按保存图片.点击按钮保存到系统相册</text> ...
- 微信小程序手机预览请求不到数据(最后一条不明所以)
本地开发调试小程序时,用手机预览需要有如下设置:1.微信开发者工具中设置:不校验安全域名.web-view 域名.TLS 版本以及 HTTPS 证书.这样在有网络请求的时候,就可以访问本地的服务器了, ...
- 微信小程序H5预览页面框架(二维码不隐藏)
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- 微信小程序H5预览页面框架
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- 微信小程序,预览在开发工具上显示正常,手机预览二维码报request->fail错误,打开手机的调试功能又正常。
这里错误很明显是属于网址错误,开发工具和手机调试都能走request->success: 唯独常规模式下无法显示. 最开始调试过很多方法,没找出原因.最后到小程序开发设置才发现,自己未配置服务器 ...
- 微信小程序图片放大预览
需求:当点击图片时,当前图片放大预览,且可以左右滑动 实现方式:使用微信小程序图片预览接口 我们可以看到api需要两个参数,分别通过下面的data-list和data-src来传到js中 wxml代码 ...
随机推荐
- 【leetcode】1187. Make Array Strictly Increasing
题目如下: Given two integer arrays arr1 and arr2, return the minimum number of operations (possibly zero ...
- Python之基于十六进制判断文件类型
核心代码: #!/usr/bin/env python # -*- coding: utf-8 -*- # @Author : suk import struct from io import Byt ...
- 一次linux站点安装经验
之前了解了一点,刚过完年回来,顺便研究了一下小程序. http://s.w7.cc/index.php?c=wiki&do=view&id=1&list=84 先申请了一个li ...
- layui的数据表格加上操作
数据表格加上操作. <script type="text/html" id="barDemo"> <a class="layui-b ...
- C# 两个进程之间通讯(管道通信 )
#region 客户端 NamedPipeClientStream pipeClient = new NamedPipeClientStream("localh ...
- 文件操作:fopen()
r 打开只读文件,该文件必须存在. r+ 打开可读写的文件,该文件必须存在. rb+ 读写打开一个二进制文件,只允许读写数据. rt+ 读写打开一个文本文件,允许读和写. w 打开只写文件, ...
- 使用VSCODE开发UE4
完全可行,速度很快,智能提示.代码格式化.查找Symbol等等都不比VS+Visual AssistX 差. 准备 打开编辑器的Editor Preferences>Source Code,选择 ...
- R_Studio(癌症)数据连续属性离散化处理
对“癌症.csv”中的肾细胞癌组织内微血管数进行连续属性的等宽离散化处理(分为3类),并用宽值找替原来的值 癌症.csv setwd('D:\\data') list.files() dat=read ...
- R_Studio读取xls文件
百度经验 传送门 需要包xlsx 依赖包rjava 需要安装java编译环境 在R Console中执行命令install.packages("rjava"),install.pa ...
- Java字符串的替换(replace()、replaceFirst()和replaceAll())
在 Java 中,String 类提供了 3 种字符串替换方法,分别是 replace().replaceFirst() 和 replaceAll(),本文将详细介绍它们的使用方法. replace( ...