第一次使用swiper出现的各种奇葩问题,搞得头疼
1.同一页面存在多个swiper时,不能以通用的id或者class为定位标准,容易出现同时找到多个对象的问题,需要确保id和class的唯一性
2.动态创建swpier,append到html中时,swiper-slide必须放在swiper-wrapper中,否则初始化后,会因为结构不完整报错
slider1
3.动态创建swiper的slide页时,使用源生的swiper.appendSlide()代替replace(),执行效率更高,并且不容易出现错乱
项目案例:产线屏-电子展板与人员绩效多个tab来回切换时,电子展板初始化后,可以正常上下页切换刷新;从人员绩效切换回来的时候,出现无法下页切换,之能上页切换的问题,F12查看Elements发现swiper的结构发生变化,猜测由于replace()替换前后的清空,并未完全清空上一次加载的slide,导致多个slide重复,无法出现切换下页的情况
if(window.swiper){
//销毁swiper
window.swiper.destory(false);
}