优化长列表的swiper

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了优化长列表的swiper相关的知识,希望对你有一定的参考价值。

参考技术A

比如,现在有一个长列表,点击列表,swiper显示,并且swiper-item显示点击对应的列表项信息。可以拖动切换swiper-item。如:

设长列表数据为goodsList, 错误的做法

直接遍历整个goodsList去生成swiper-item,节点太多会导致卡顿。

正确的做法

根据当前选中的choiceItem,只显示前后两个加当前,三个swiper-item,做到了优化。
js部分

以上是关于优化长列表的swiper的主要内容,如果未能解决你的问题,请参考以下文章

长列表优化

记一次vue长列表的内存性能分析和优化

vue 长列表优化

vue长列表性能优化

小程序长列表渲染优化另一种解决方案

React 虚拟化长列表