效果图:

 ====》  

==》

 代码:

<image mode='aspectFill' bindtap='previewImage'  data-src='{{dataList.avatar}}' src="{{dataList.avatar}}"></image>
/**
* 页面的初始数据
*/
data: {
imgUrls:[],//预览用的
dataList: [],//后台接口返回的数据 暂存区
},
/**
* 预览头像
*/
previewImage(e) {
const current = e.target.dataset.src
// console.log(current)
wx.previewImage({
current,
urls: this.data.imgUrls
})
},

小程序预览图片wx.previewImage的更多相关文章

  1. 微信小程序预览图片

    选择图片时可设置图片是否是原图,图片来源.这用的也挺常见的,比如个人中心中设置头像,可以与wx.upLoadFile()API使用 主要方法: wx.chooseImage(object) wxml ...

  2. mpvue打小程序预览码

    喂,快给我打一个小程序预览码 前端大全 昨天 (点击上方公众号,可快速关注) 来源:写Bug segmentfault.com/a/1190000015336845 需求 开发小程序的朋友们随时都会听 ...

  3. 微信小程序--预览previewImage(长按保存图片)

    最近开发小程序,想实现二维码图片长按保存,发现无法保存,只能让图片先预览,再保存.注意:只有太阳码才有长按保存和识别功能,普通二维码只有长按保存功能. <image class='banner' ...

  4. 小程序预览pdf文件

    有个业务需求,需要在小程序查看客户已开的发票 发票地址: https://www.chinaeinv.com/p.jspa?cxxxxxxxxxxxx 刚开始是想利用webview当作外链进行跳转访问 ...

  5. 微信小程序预览Word文档

    <view data-url="https://xxxcom/attachment/word.docx" data-type="docx" catchta ...

  6. 微信小程序开发之图片预览

    实现图片的展示和大图预览 使用wx.previewImage(OBJECT)来实现 OBJECT参数说明: 参数 类型 必填 说明 current String 否 当前显示图片的链接,不填则默认为 ...

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

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

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

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

  9. 微信小程序:点击预览图片

    在开发微信小程序时,开发人员会参考着小程序api来开发小程序,但有的时候根据情况不同很容易出现bug,以下是我在开发小程序时出现的各种bug,在开发时有需要预览图片. 1.xml <view c ...

随机推荐

  1. linux 中 /dev/null和/dev/zero的作用以及区别

    在类Unix操作系统中,设备节点并不一定要对应物理设备.没有这种对应关系的设备被称之为伪设备.操作系统运用了它们实现多种多样的功能,/dev/null和/dev/zero就是这样的设备,类似的还有/d ...

  2. JQ,JQuery的ajax卡住了,浏览器页面卡住

    在使用ajax的时候浏览器卡住了, 经过测试是因为在ajax中使用的data数据变量写错了 不存在也不报错,直接卡主了 好好检查一下吧.

  3. 亿图图示v9.2.0.0 官方中文版及破解激活补丁

    介绍 亿图图示是一款由深圳市亿图软件有限公司开发的全类型,综合图形图表设计软件,解决跨平台,多领域,全终端的图形设计,图文混排和工程制图等需求.亿图图示是一款简单易用的快速制图软件,适合任何人绘制任何 ...

  4. LGP3126题解

    这道题还有点意思. 路径要求是一个回文串,回文串立马枚举中点.中点只可能在对角线上. 枚举对角线上的一个点,然后两边的路径必须完全相同. 既然路径上的字符必须完全相同,那么每个前缀也必须完全相同. 考 ...

  5. python学习之matplotlib实战

    import numpy as np def main(): # print("hello") # line import matplotlib.pyplot as plt x = ...

  6. java反射获取类的成员函数,成员变量,构造函数

    package com.imooc.reflect;import javax.sound.midi.Soundbank;import java.lang.reflect.Constructor;imp ...

  7. 如何防止 IP 被盗用 保护网络正常运行

    IP被盗用是指盗用者使用未经授权的IP来配置网上的计算机.目前IP盗用行为非常常见,许多"不法之徒"用盗用地址的行为来逃避追踪.隐藏自己的身份.IP的盗用行为侵害了网络正常用户的权 ...

  8. Ubuntu18.04..5 配置国内镜像源:解决E: Failed to fetch

    镜像下载.域名解析.时间同步请点击 阿里云开源镜像站 问题描述 使用 sudo apt get-install 出现 E: Failed to fetch问题. 更换镜像源 错误原因:绝大多数情况下, ...

  9. ZYNQ生成一个工程的基本步骤

    Zynq 7000 SoC 是业界首款All Programmable SoC 组成: PL(FPGA部分) PS(ARM部分) PL和PS数据传输的 高效接口:AXI和ACP PS: 处理系统(Pr ...

  10. GitHub还能这样玩,这次我真是开了眼了

    哈喽,大家好,我是指北君. 我会一直在"开源指北"公众号给大家分享各种有趣. 实用与最前沿的开源项目,还有各种互联网干货, 今天主要给大家分享一下GitHub的一些使用技巧,帮助你 ...