uniapp - 强力解决 swiper 轮播图内嵌套视频导致滑动不流畅卡顿问题,轮播滑块视图容器里既有图片也有视频video组件共同存在出现滑动切换特别卡,轮播组件包裹视频播放器加载慢及层级过高解决

前言

在 uniapp(H5网页网站、支付宝/微信小程序、安卓App、苹果App、nvue)全平台开发中,uniapp swiper 同时共存视频和图片导致切换滑动时卡顿加载慢问题,并且视频还没播放完毕就自动切换划走了,如何监听视频播放完毕后轮播图再自动划走,swiper-item里有图片或视频快速滑动不流畅甚至卡死不动(视频和图片虽然不多但依旧会卡),大概率会在苹果app和安卓app端出现问题,做类似抖音快手短视频上下滑动的功能同样会出现该问题,因为swiper组件里确实嵌套了大量视频(如果不做优化调整肯定会特别卡),无论哪个平台端只要存在这个问题就能有效解决。

uniapp(v2 | v3)版本项目均可使用。


如下图所示,做 “上下滑动” 或 “左右滑动” 都可以高效解决。

详细示例,保证100%解决

在这里插入图片描述

解决方案

按照下方教程及示例代码,轻松搞定此问题。

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

王二红

请作者喝杯咖啡 :)

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值