点击预览大图功能

1、 给轮播图swiper-item绑定点击事件

2、 预览功能的本质是调用了小程序的api:previewImage

微信公众号----文档----开发----API----媒体----图片----wx.previewImage

输入wx-previewImage,删除后面三个参数。

先构造要预览的图片数组，数组中的值为pics数组中pics_mid,但是此时在handlePreviewImage方法中拿不到goodsObj,为了方便获取属性，我们可以设置一个全局对象，

然后在请求成功之后给goodsInfo赋值即可。

然后通过map方法获取数组中的特定属性重新组成的数组

点击事件触发，接收传递过来的图片url,通过自定义属性的方式传参。

微信小程序：点击预览大图功能的更多相关文章

  1. 微信小程序图片放大预览

    需求:当点击图片时,当前图片放大预览,且可以左右滑动 实现方式:使用微信小程序图片预览接口 我们可以看到api需要两个参数,分别通过下面的data-list和data-src来传到js中 wxml代码 ...

  2. 原创：跳坑指南——微信小程序真机预览跟本地不同的问题

    微信小程序中出现最多的一个问题,就是真机跟本地不同:我简单列举一些我发现的原因,给大家参考,大家也可以把自己发现的东西回复给我,给我参考:本地看不到数据,就先让本地能看到数据,再看本帖.... 1:本 ...

  3. 微信小程序真机预览跟本地不同的问题。原文地址：https://blog.csdn.net/qq_27187991/article/details/69664247/

    微信小程序中出现最多的一个问题,就是真机跟本地不同:我简单列举一些我发现的原因,给大家参考,大家也可以把自己发现的东西回复给我,给我参考: 本地看不到数据,就先让本地能看到数据,再看本帖....特别提 ...

  4. 【微信小程序】微信小程序wx.previewImage预览图片

    一.小知识 二.例子,配合轮播图使用效果更佳!(如图1) 1.wxml <scroll-view scroll-y="true"> <swiper catchta ...

  5. 微信小程序：图片预览

    wxml页面: <image src='{{UPLOAD_IMAGES_URL}}{{vv.img_s}}' data-src="{{vv.img}}" bindtap=&q ...

  6. 微信小程序点击图片放大预览

    微信小程序点击图片放大预览使用到 wx.previewImage 接口,可以放大.上/下一张 上代码 wxml代码 <view class='content-img' wx:if="{ ...

  7. 微信小程序点击控制元素的显示与隐藏

    微信小程序点击控制元素的显示与隐藏 首先我们先来看一下单个点击效果 我们来看一下wxml中的代码: <view class="conten"> <view cla ...

  8. 微信小程序0.11.122100版本新功能解析

    微信小程序0.11.122100版本新功能解析   新版本就不再吐槽了,整的自己跟个愤青似的.人老了,喷不动了,把机会留给年轻人吧.下午随着新版本开放,微信居然破天荒的开放了开发者论坛.我很是担心官方 ...

  9. 微信小程序点击保存图片到本地相册——踩坑

    在微信小程序中要保存图片到本地相册,需要获取相册权限. 总之整个功能实现下来需要如下几个小程序的API:wx.getSetting,wx.authorize,wx.openSetting,wx.dow ...

随机推荐

  1. Java排序算法（四）希尔排序2

    Java排序算法(四)希尔排序2 希尔排序移步法:分组+直接插入排序组合 一.测试类SortTest import java.util.Arrays; public class SortTest { ...

  2. Windows下使用poetry和pyproject.toml

    0. 题引 为什么要使用poetry? 因为想使用pyproject.toml,并通过pyproject.toml进行依赖包管理,目前pip还不支持,所以poetry是首选 为什么要使用pyproje ...

  3. vue开发东京买菜,全栈项目,前端django,带手机GPS精准定位,带发票系统,带快递系统,带微信/支付宝/花呗/银行卡支付/带手机号一键登陆,等等

    因为博客园不能发视频,所以,完整的视频,开发文档,源码,请向博主索取 完整视频+开发文档+源码,duanshuiLu.com下载 vue+django手机购物商城APP,带支付,带GPS精准定位用户, ...

  4. 【noi 2.6_1759】LIS 最长上升子序列（DP，3种解法）

    题意我就不写了.解法有3种: 1.O(n^2).2重循环枚举 i 和 j,f[i]表示前 i 位必选 a[i] 的最长上升子序列长度,枚举a[j]为当前 LIS 中的前一个数. 1 #include& ...

  5. Codeforces Round #691 (Div. 2) C. Row GCD (数学)

    题意:给你两个数组\(a\)和\(b\),对于\(j=1,...,m\),找出\(a_1+b_j,...,a_n+b_j\)的\(gcd\). 题解:我们很容易的得出\(gcd\)的一个性质:\(gc ...

  6. 02、scrapy安装

    1.安装scrapy 采用pip的安装方式,从豆瓣源获取 pip install -i https://pypi.douban.com/simple/ scrapy 安装过程中会报出错误: build ...

  7. [Golang]-6 超时处理、非阻塞通道操作、通道的关闭和遍历

    目录 超时处理 非阻塞通道操作 通道的关闭 通道遍历 超时处理 超时 对于一个连接外部资源,或者其它一些需要花费执行时间的操作的程序而言是很重要的. 得益于通道和 select,在 Go中实现超时操作 ...

  8. Docker网络模式详解

    一.Docker四种工作模式 安装Docker时,它会自动创建三个网络,bridge(创建容器默认连接到此网络). none .hosthost:容器将不会虚拟出自己的网卡,配置自己的IP等,而是使用 ...

  9. SSH 密钥认证

    目录 SSH协议概述 SSH 和 Telnet 的区别 SSH 相关命令 SSH 验证方式 基于密钥的安全认证 SSH 优化 expect 脚本免交互登录 sshpass 免交互登录 SSH协议概述 ...

  10. python argparse (更新中)

    action='store_true' 例如 parser.add_argument("--generate_text_embedding", action='store_true ...