美文网首页vue项目实战项目总结
vue实战(3)——vue中swiper-slide中异步加载数

vue实战(3)——vue中swiper-slide中异步加载数

作者: wayne1125 | 来源:发表于2018-05-24 01:04 被阅读0次

    一、场景描述

    vue中使用swiper做多个tab切换时,一般会加上autoHeight为true来自适应不同swiper-slide的高度,这种情况在每个swiper-slide内数据都是本地数据的时候,autoHeight都能正常计算swiper-container的高度,但当swiper-slide中数据是接口获取的数据时,由于异步加载数据的原因会导致swiper-container就算高度出现问题,导致页面不能往下滑动的问题

    banner中img是多张图的组合,slide的高度会很大 swiper配置 接口获取数据时,不能正常计算swiper-container的高度

    二、粗鲁的解决办法

    延时1000ms先设置swiper-container的高度,再设置成高度自适应 延时后swiper-container高度渲染正常 

    注:此方法过于粗鲁,希望看到这篇文章的各路大神有什么好的方法赶紧拍砖,不胜感激![抱拳][抱拳][抱拳]

    相关文章

      网友评论

        本文标题:vue实战(3)——vue中swiper-slide中异步加载数

        本文链接:https://www.haomeiwen.com/subject/fgfjjftx.html