小程序 lazy-load 不生效的问题
最近在开发家里喵喵的小程序(娱乐),本想抽一小部分时间做个懒加载。看了小程序官网 API,给 image 标签加上 lazy-load 就能实现懒加载。但从微信开发者工具看,似乎并没有生效。搜了一下,很多小伙伴似乎都遇到了问题,并没有解决。
但经过我的验证, 懒加载确实是生效了 。
只不过, 小程序会提前加载当前屏幕和下一屏的图片,导致感知不到懒加载的存在。
个人认为,这样的懒加载比传统懒加载的体验更加好。
我的验证过程:
验证过程
wxml部分(用 scroll-view 并且加上 bindload):
<scroll-view class="container" scroll-y>
<view wx:for="{{list}}" class="list-item">
<image class="list-img" lazy-load src="{{item.img}}" bindload='onLazyLoad'></image>
<view>{{item.desc}}</view>
</view>
</scroll-view>
js部分:
const app = getApp()
Page({
data: {
list: []
},
onLazyLoad(info) {
console.log(info)
}
})
最终效果

清空首屏输出日志后,滑动过程中输出的日志:

小程序 lazy-load 不生效的问题的更多相关文章
- 微信小程序的calc不生效处理
大致文字初略的记录描述一下问题:外层是relative相对定位,内部一个view 需要绝对定位bottom的值为128rpx,同时还要兼容适配苹果x的底部,所以值是这样设置的: bottom: cal ...
- uni-app解决小程序圆角样式不生效
在使用uni-app实现小程序的时候,设置左图的右圆角不生效,样式也都没有问题,在模拟器上也可以正常现实,手机上样式出现差别,现有以下解决方法: 设置整个圆角,然后左边使用margin-left:-3 ...
- 微信小程序 bindcontroltap 绑定 没生效
微信 bindcontroltap 绑定 没生效 多次查看官方文档,代码没有问题, 解决: windows下 显示设置中 缩放必须是100%,
- 【重点突破】—— UniApp 微信小程序开发官网学习One
一.初步认识 uni-app官网:https://uniapp.dcloud.io/component/README HBuilderX官方IDE下载地址: http://www.dcloud.io/ ...
- 微信小程序学习笔记五 常见组件
1. 常见组件 重点讲解小程序中常用的布局组件 1.1 view 代替 原来的div标签 <!-- pages/index/index.wxml --> <view hover-cl ...
- Lazy freeing of keys 对数据的额异步 同步操作 Redis 4.0 微信小程序
https://github.com/antirez/redis/blob/4.0-rc1/00-RELEASENOTES 数据缓存 · 小程序 https://developers.weixin.q ...
- mpvue 小程序加载不了图片 Error: Failed to load local image resource /images/xx.png the server responded with a status of 404 (HTTP/1.1 404 Not Found)
mpvue开发小程序时候,要添加静态本地图片 <img src="../../images/bg.png" alt=""> 会报错: VM14878 ...
- Taro-UI 2.0样式在H5上生效,微信小程序不生效?
答案: https://taro-ui.aotu.io/#/docs/questions taro-ui 自定义样式覆盖小程序组件样式使用到了 globalClass 这个微信小程序特性,由于微信小程 ...
- 微信小程序警告设置 enable-flex 属性以使 flexbox 布局生效的解决办法
微信小程序警告设置 enable-flex 属性以使 flexbox 布局生效的解决办法 具体情况: scroll-view 滚动,设置 display:flex 不生效并警告设置 enable-fl ...
随机推荐
- C#中四步轻松使用log4net记录本地日志(WPF有点小区别)
在这里,记录我在项目中使用log4net记录本地日志的步骤.在不会之前感觉很难,很神秘,一旦会了之后其实没那么难.其实所有的事情都是一样的,下面我就分享一下我使用log4Net的经验. 第一步:首先从 ...
- 【详记MySql问题大全集】三、安装之后没有my.ini配置文件怎么办
系列目录 一.安装MySql 二.安装并破解Navicat 三.没有my.in配置文件怎么办 四.设置MySql的大小写敏感 五.重置MySql登陆密码 之前说过,Windows操作系统中,我们安装M ...
- 五、activiti工作流-学生请假流程
有了上一节的基础,这节主要讲如何创建一个学生请假流程.部署.运行流程实例.查看任务.执行任务.判断流程实例状态.历史任务(实例)查询.历史活动节点查询 记住,一个正在执行的流程,他的流程定义id无论到 ...
- python读取并写入csv文件
在ubuntu下,新建.csv文件的方法是使用LibreOffice来创建一个数据表,然后我们把表格存储为.csv的格式: “Save as”菜单把我们的表格存为一个CSV的文件格式:命名为csvDa ...
- gdb调试的layout使用
layout:用于分割窗口,可以一边查看代码,一边测试.主要有以下几种用法:layout src:显示源代码窗口layout asm:显示汇编窗口layout regs:显示源代码/汇编和寄存器窗口l ...
- 解决Python中PyCharm导入模块时,模块名下出现红色波浪线的问题
在博主第一次在PyCharm中导入模块时,模块名下出现红色波浪线,不影响程序执行,但强迫症忍不了 以下是解决办法 Let's do it ... 进入设置,找到Console下的Python Cons ...
- asp.net core mvc上传大文件解决方案
默认上传文件大小不超过30M 第一个问题: IIS 10.0 详细错误 - 404.13 - Not Found 请求筛选模块被配置为拒绝超过请求内容长度的请求. 服务器上的请求筛选被配置为拒绝该请求 ...
- Salesforce Sales Cloud 零基础学习(四) Chatter
Chatter是一个Salesforce实时协作应用程序,它允许你的用户一起工作.互相交谈和共享信息,不管用户角色或位置如何,连接.并激励用户在整个组织内高效工作. Chatter 让用户们在 Opp ...
- 项目ITP(三) 玩玩 服务端 到 app端
前言 系列文章:[传送门] 泡泡脚,写写博客,规律生活,睡个好觉,待会看会书. 正文 上面讲了二维码生成,及 手机端扫一扫,大家有兴趣去看看. 今天我们讲一下,百度云推送平台. 每天想着问题,问题只会 ...
- hd1007
#include <iostream> #include <algorithm> #include <cmath> using namespace std; str ...