swiper.js根据swiper-slide的内容高度动态设置swiper-wrapper的高度怎么实现

Question

onSlideChangeEnd: function(swiper){
            var activeHight=$(".swiper-slide").eq(swiper.activeIndex).height()
            console.log(activeHight)
            // $(".swiper-wrapper").height(activeHight)
            // console.log($(".swiper-wrapper").height())
        }

现在是这么写的 但是 只有在第一次切换管用 后面设置wrapper 的高度就不管用了
但是不写后面那两句输出activeHeight也是有问题的 前几次滑动 只有往左滑动 过才能显示出数值 不然就是0

但是只要写后面的 activeHeight输出也不变了
请问怎么实现 是由于加载顺序还是什么呢
求大神指教

现在不动态改的话 swiper-wrapper的高度总是不配的 滑动经常出现下面空白很大的情况

 var mySwiper = new Swiper('.swiper-container', {
        autoHeight: true,
        onSlideChangeStart: function(swiper){
            var activeHight=$(".swiper-slide").eq(mySwiper.activeIndex).height();
            console.log(activeHight)
            $(".swiper-container").height(activeHight)
        },
        onTransitionEnd: function (swiper) {
            $('#nav li').eq(mySwiper.activeIndex).addClass('active').siblings().removeClass('active');

            var tabIndex = $('#nav li').eq(mySwiper.activeIndex).data("id");
            pageTab = tabIndex;
            $("#divOrder" + tabIndex).show().siblings().hide();
            myScroll.scrollTo(0, 0);
            GetOrderList(tabIndex);
        }

    });
    mySwiper.disableMousewheelControl();
    $('#nav li').click(function () {
        $(this).addClass('active').siblings().removeClass('active');

        mySwiper.slideTo($(this).index(), 500);

        var tabIndex = $(this).data("id");
        pageTab = tabIndex;
        $("#divOrder" + tabIndex).show().siblings().hide();
        myScroll.scrollTo(0, 0);
        GetOrderList(tabIndex);
    });

我知道了 滑动没有数据出现 是数据是异步过来的 没数据的时候就把height取了所以是0 等数据加载出来也显示不出来了 因为外层容器高度是0
在浏览器加断点顺序执行就能出来数据 应该也是印证了这点
但是现在还是不知道怎么解决><

Answer 1

.swiper-wrapper{height: auto!important;}
这样就OK了

Answer 2

要用$(".swiper-container").height(activeHight)

异步获取数据后再改变swiper-container的高度啊

var swiper = new Swiper('.swiper-container', {
    onSlideChangeStart: function(swiper) {
        var activeIndex = swiper.activeIndex;
        GetOrderList(activeIndex);
    }
});

function GetOrderList(index) {
    setTimeout(function() {
        //异步获取数据后再改变swiper-container的高度,我这里用了setTimeout代替...
        var activeHight = $(".swiper-slide").eq(index).height()
        $(".swiper-container").height(activeHight)
    }, 1000);
}

Answer 3

autoHeight: true