微信小程序——网盘图片预览
微信小程序图片预览提供了一个wx.previewImage接口,如下图:

现在我需要对网盘文件里的图片预览,但是网盘从后台返回的数据是各种类型的文件,如下图所示:

那么我们需要解决2个问题:
1.从这些列表中提取出只是图片类型的列表,并将它的url存入数组中;
2.获取当前你点击图片的索引值。
解决思路:
解决问题1:
假设从后台获取到的文件的列表保存到数组diskList中,我们可以通过filter提取出类型为image的列表,保存到数组imgList中。
然后再通过forEach刚刚筛选出来的imgList提取出它的url,保存到数组imgUrlList中。
解决问题2:
通过indexOf方法,在imgUrlList通过判断当前图片的路径返回索引值。
核心代码截图:



大致思路和解决方法已讲述完毕,如有疑问,欢迎留言~如果您有更好的解决方案,希望不吝赐教~~
微信小程序——网盘图片预览的更多相关文章
- 微信小程序开发之图片预览
实现图片的展示和大图预览 使用wx.previewImage(OBJECT)来实现 OBJECT参数说明: 参数 类型 必填 说明 current String 否 当前显示图片的链接,不填则默认为 ...
- 微信小程序点击图片预览-wx.previewImage
<view class='imgList'> <view class='imgList-li' wx:for='{{imgArr}}'> <image class='im ...
- 微信小程序-点击图片预览
拿接口 有封装 封装查看另外的博文 点击动作 WXHTML 注意 data-xxxx自定义属性 这样知道我点的是哪个参数
- 微信小程序:点击预览图片
在开发微信小程序时,开发人员会参考着小程序api来开发小程序,但有的时候根据情况不同很容易出现bug,以下是我在开发小程序时出现的各种bug,在开发时有需要预览图片. 1.xml <view c ...
- 微信小程序(组件demo)以及预览方法:(小程序交流群:604788754)
1. 获取微信小程序的 AppID 登录 https://mp.weixin.qq.com ,就可以在网站的"设置"-"开发者设置"中,查看到微信小程序的 Ap ...
- 微信小程序:点击预览大图功能
点击预览大图功能 1. 给轮播图swiper-item绑定点击事件 2. 预览功能的本质是调用了小程序的api:previewImage 微信公众号----文档----开发----API----媒体- ...
- 小程序 canvas实现图片预览,图片保存
wxml 代码: <view class="result-page"> <canvas bindtap="previewImage" canv ...
- 解决微信小程序wepy真机预览跟本地表现不一样,数据变化了视图没变化
当时搜了很多相关问题都没找到相似的 只看到有这个相似的描述wepy在onLoad里修改data-object的值页面不渲染 ,通过setData解决的. 但是这个还不是根本的解决办法,有些地方用set ...
- 【微信小程序】下载并预览文档——pdf、word、excel等多种类型
.wxml文件 <view data-url="https://XXX/upload/zang." data-type="excel" catchtap= ...
随机推荐
- Spring 注解@Component,@Service,@Controller,@Repository
Spring 注解@Component,@Service,@Controller,@RepositorySpring 2.5 中除了提供 @Component 注释外,还定义了几个拥有特殊语义的注释, ...
- C++/C课程设计(2)工资管理系统功能说明
原文取自个人博客:www.jycoder.com欢迎訪问 百度网盘下载源码:Demo.zip 百度网盘下载软件文档:软件文档.zip 工资管理系统 一, 基本功能要求: 1)以password ...
- jQuery正则的使用
转自:http://www.maiziedu.com/wiki/jquery/regular/ 基础正则 1.正则表达式的创建 a) var checkNum = /^[A-Za-z0-9]+$/; ...
- (原创)c++11改进我们的模式之改进观察者模式
和单例模式面临的是同样的问题,主题更新的接口难以统一,很难做出一个通用的观察者模式,还是用到可变模板参数解决这个问题,其次还用到了右值引用,避免多余的内存移动.c++11版本的观察者模式支持注册的观察 ...
- Vue.js使用-http请求
Vue.js使用-ajax使用 1.为什么要使用ajax 前面的例子,使用的是本地模拟数据,通过ajax请求服务器数据. 2.使用jquery的ajax库示例 new Vue({ el: '#app' ...
- Secure gRPC with TLS/SSL
摘自:http://bbengfort.github.io/programmer/2017/03/03/secure-grpc.html Secure gRPC with TLS/SSL 03 Mar ...
- 图解zookeeper FastLeader选举算法【转】
转自:http://codemacro.com/2014/10/19/zk-fastleaderelection/ zookeeper配置为集群模式时,在启动或异常情况时会选举出一个实例作为Leade ...
- 【神经网络】LSTM 网络
Long Short Term 网络—— 一般就叫做 LSTM ——是一种 RNN 特殊的类型,可以学习长期依赖信息.LSTM 由Hochreiter & Schmidhuber (199 ...
- java多线程17:ThreadLocal源码剖析
ThreadLocal源码剖析 ThreadLocal其实比较简单,因为类里就三个public方法:set(T value).get().remove().先剖析源码清楚地知道ThreadLocal是 ...
- 通用后台管理系统(ExtJS 4.2 + Spring MVC 3.2 + Hibernate)
通用后台管理系统(ExtJS 4.2 +Spring MVC 3.2 + Hibernate) 开发语言JAVA 成品成品 前端技术extjs 数据库mysql,sql server,oracle 系 ...