17行代码解决微信小程序图片延迟加载
js 页面
Page({
data: {
realScrollTop: 0,//页面滚动距离
driveHeight //屏幕高度可初始化设置
},
scroll(e){
if(e.detail.scrollTop > this.data.realScrollTop){
this.setData({
realScrollTop: e.detail.scrollTop
});
}
}
});
wxmal页面
<scroll-view scroll-y="true" scroll-top="{{resetScrollTop}}" bindscroll="scroll" >
<image wx:if="{{realScrollTop+driveHeight*2 > (index*70)}}" src="{{item['img']}}"></image>
<image wx:else src="{{item['bgm']}}"></image>
</scroll-view>
17行代码解决微信小程序图片延迟加载的更多相关文章
- 5行代码实现微信小程序图片上传与腾讯免费5G存储空间的使用
本文介绍了如何在微信小程序开发中使用腾讯官方提供的云开发功能快速实现图片的上传与存储,以及介绍云开发的 5G 存储空间的基本使用方法,这将大大提高微信小程序的开发效率,同时也是微信小程序系列教程的视频 ...
- 微信小程序图片上传和裁剪
本篇博客用于解决微信小程序图片裁剪问题 图片裁剪常用于头像选择和图片合成等. 图片裁剪解决方案: 目前网络上知名的微信小程序图片裁剪插件是we-cropper(文末有链接) 操作步骤:下载好we-cr ...
- 解决微信小程序安卓手机访问不到图片,无法显示图片
关于微信小程序不显示图片 通病可能有以下几个可能性: 非本地图片:确定图片资源存在,copy 图片url再浏览器打开,确定图片资源存在且能正常访问 本地图片:确定相对路径或者绝对路径正确 微信小程序图 ...
- 微信小程序--图片相关问题合辑
图片上传相关文章 微信小程序多张图片上传功能 微信小程序开发(二)图片上传 微信小程序上传一或多张图片 微信小程序实现选择图片九宫格带预览 ETL:微信小程序之图片上传 微信小程序wx.preview ...
- 微信小程序图片放大预览
需求:当点击图片时,当前图片放大预览,且可以左右滑动 实现方式:使用微信小程序图片预览接口 我们可以看到api需要两个参数,分别通过下面的data-list和data-src来传到js中 wxml代码 ...
- 如何解决微信小程序界面适配问题-引用-生命周期回调函数-优化机制-样式引入
如何解决微信小程序界面适配问题 .wxss page{ height: 100%; width:750rpx; } this.setData({ imageWidth: wx.getSystemInf ...
- 解决微信小程序使用wxcharts在屏幕不固定问题-开发工具里也显示好了布局,为啥到真机就是乱的
解决微信小程序使用wxcharts在屏幕不固定问题-开发工具里也显示好了布局,为啥到真机就是乱的 .chart{ width: 100%; text-align: center; } .canvas{ ...
- 解决微信小程序登录与发布的一些问题
解决微信小程序的问题 图片在电脑上显示但在手机上却无法显示的问题 要使用的是本地图片,不想把图片上传到网络再通过https的方式解决,解决方法如下: 1.image src中的图片地址对英文字母大小写 ...
- 解决微信小程序用 SpringMVC 处理http post时请求报415错误
解决微信小程序用 SpringMVC 处理http post时请求返回415错误 写微信小程序时遇到的问题,这个坑硬是让我整了半天 wx.request请求跟ajax类似处理方法一致 小程序端请求代码 ...
随机推荐
- Linux命令--1
之前一直在学习Linux,不过有点一天打鱼两天晒网的意味,现在希望通过写博客的形式,积累更多的知识,也希望可以帮到同在linux坑中的各位小伙伴们~ PS:我的笔记重点在于通俗,很多命令一百度就有,但 ...
- 微软Power BI 每月功能更新系列——11月Power BI 新功能学习
Power BI Desktop11月产品功能摘要 本月Power BI Desktop 有一个大规模的更新.现在,通常可以使用复合模型在一个模型中将直接查询和导入源组合在一起.UserVoice上的 ...
- 2.11 alert\confirm\prompt
2.11 alert\confirm\prompt 前言 不是所有的弹出框都叫alert,在使用alert方法前,先要识别出到底是不是alert.先认清楚alert长什么样子,下次碰到了,就可以用 ...
- threejs linesegment的拾取实验
通过对线段(图中的线段在绘图里,是一条线段)的拾取发现如下几个特点: 1)index表示一条线段的from向量index,即第几个分段: 2)线段空白的地方拾取不到(不属于线段上): 3)为何用多条分 ...
- Java中的容器 I————浅谈Queue和PriorityQueue
一.Queue的实现 通过LinkedList类实现Queue接口来完成对Queue的实例类的实现,代码如下: Queue<Integer> queue=new LinkedList< ...
- Rodrigues(罗德里格斯)旋转公式推导
1. 2.推导过程:我们的目的是求得vrot,所以应该求得v||和vrot在垂直于k方向的投影向量. 其中, 俯视图看: 此外,另一种表示方法为: R可以看作旋转矩阵.
- cf——Sasha and a Bit of Relax(dp,math)
关于异或运算,是可以求前缀和的.还有一些异或运算的性质 0^a=a; 交换律 a^b=b^a 结合律 a^(b^c)=(a^b)^c 分配率 a^(b+c)=a^b+a^c 自反律 a^b^b=a 判 ...
- xdoj-1319 求树上任意一点的最大距离----利用树的直径
1 #include <bits/stdc++.h> using namespace std; ; vector < vector <int> > g(N); in ...
- java-抽象类的成员特点
1.成员变量:既可以是变量,也可以是常量.abstract不能修饰成员变量. 2.构造方法:有.用于子类访问父类数据的初始化. 3.成员方法:既可以是抽象的,也可以是非抽象的. - 抽象方法:强制要求 ...
- #366 A-C
A. Hulk 题意是给你一个n 输出一个英文字符串,找下规律就发现 当(i!=n&&i%2==1) 输出的是 I hate that (注意大写) 当(i!=n&&i ...