移动端轮播图下内容抖动问题

在用vue写移动端时候发现一个问题，那就是轮播图下方的内容在网速慢（网络是3G）的情况下，会出现抖动，也就是图片加载出来后，test被挤下来
下面是home页面

<home-header></home-header>
      <home-swiper></home-swiper>//轮播图
      <div>test</div> //测试内容

这是轮播图代码

<template>
  <swiper :options="swiperOption" >
    <!-- slides -->
    <swiper-slide><img class="swipe-img" src="http://img1.qunarzz.com/piao/fusion/1706/b8/a8e8ff02b094c802.jpg_750x200_ddaec8e5.jpg" alt=""></swiper-slide>
    <swiper-slide><img class="swipe-img" src="http://img1.qunarzz.com/piao/fusion/1811/29/2a6b77b6ff72402.jpg_750x200_d4cec568.jpg" alt=""></swiper-slide>
    <swiper-slide><img class="swipe-img" src="http://img1.qunarzz.com/piao/fusion/1812/d6/daa880b254940402.jpg_750x200_b114308a.jpg&#