小程序
小游戏
企业微信
微信支付
扫描小程序码分享
用swiper在页面上渲染数据非常慢,数组长度75就渲染的很慢,求教有没有办法优化体验
5 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
好家伙 swiper居然一次性渲染75条
给你个方案,创建一个listCopy数组,里面设置和list一样的数量的空字符串对象数组,比如['','','','',....]
然后一开始给数组前两个值赋值,比如listCopy[0]=list[0];listCopy[1]=list[1]
然后在swiperChange里面,每次change的时候删掉一个listCopy已经显示的值,再加上一个未显示的值,比如第一次change删掉listCopy[0],再使listCopy[2]=list[2];
这样能始终保持swiper只渲染两条数据,当然可以不止2条,4、5、6条都可以,wx:for也要改成循环listCopy
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
https://developers.weixin.qq.com/miniprogram/dev/extended/component-plus/video-swiper.html
估计强迫症看到75个点已经疯了
使用懒加载的方式进行优化
有点多。。如果没有一次滑一片的需求的话,可以只渲染3个,然后每次滚动都去设置列表和当前项
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
好家伙 swiper居然一次性渲染75条
给你个方案,创建一个listCopy数组,里面设置和list一样的数量的空字符串对象数组,比如['','','','',....]
然后一开始给数组前两个值赋值,比如listCopy[0]=list[0];listCopy[1]=list[1]
然后在swiperChange里面,每次change的时候删掉一个listCopy已经显示的值,再加上一个未显示的值,比如第一次change删掉listCopy[0],再使listCopy[2]=list[2];
这样能始终保持swiper只渲染两条数据,当然可以不止2条,4、5、6条都可以,wx:for也要改成循环listCopy
https://developers.weixin.qq.com/miniprogram/dev/extended/component-plus/video-swiper.html
估计强迫症看到75个点已经疯了
使用懒加载的方式进行优化
有点多。。如果没有一次滑一片的需求的话,可以只渲染3个,然后每次滚动都去设置列表和当前项