vue使用swiper谜一样的bug（很简单）

1018715564

简单描述一下问题，就是在做一个很普通的一个画廊效果，图片左右滑动这样子，不知道哪里写错了，请求各位大神指点一二，但是真实效果却是一个div里有多个图片
js没有报错，贴一下效果图


我的vue组件效果是这样子：


我希望的效果应该是这样的：




我的代码
<template>
    <div class="box">
     <div class="warpper">
            <swiper>
                <swiper-slide>
                    <img src="http://img1.qunarzz.com/sight/p0/1602/4d/4d8529eb55360f5090.img.jpg_r_800x800_5180d7ba.jpg" class="swiperImg">  
                </swiper-slide>
                <swiper-slide>
                    <img src="http://img1.qunarzz.com/sight/p0/1602/4d/4d8529eb55360f5090.img.jpg_r_800x800_5180d7ba.jpg" class="swiperImg">  
                </swiper-slide>
            </swiper>
        </div>
    </div>
</template>
<script>
export default {
    name:'Gllary',
}
</script>

<style lang="stylus" scoped>
        .box
         display flex
         flex-direction column
         justify-content center
         //层级最高
         z-index:99
         background #000
         //定位
         position fixed
         top 0
         left 0
         right 0
         bottom 0
         .warpper
          width 100%
          height 0
          padding-bottom 100%
          .swiperImg
           width 100%
           height 100%

</style>

jade830

我不会用这个组件，但是我会用swiper做你要的效果

x15850735927

你JS都没写，怎么会有动画效果，在mounted(){...........实例化一个Swiper}

qiaoxia

想要想要想要