zoukankan      html  css  js  c++  java
  • vue swiper 中loop为true时,第一个slide被跳过

    Vue-Awesome-Swiper , 作为 Swiper4 在vue中的组件,还是具有一定的地位。

    项目中常用的渲染如下:

    <swiper 
         ref='swipe'
         :options="swiperOption">
         <swiper-slide
             class='banner-list'
             v-for='(i,x) in bannerList' 
             :key='x'>
              <img :src="i.url"/>
         </swiper-slide>
         <div class="swiper-pagination" slot="pagination"></div>
    </swiper>

    问题是,第一个 slide 直接被跳过,解决办法是加一个 v-if ,靠 v-if 控制组件的渲染状态

    <swiper 
         ref='swipe'
         v-if='bannerList.length>0'
         :options="swiperOption">
         <swiper-slide
             class='banner-list'
             v-for='(i,x) in bannerList' 
             :key='x'>
              <img :src="i.url"/>
         </swiper-slide>
         <div class="swiper-pagination" slot="pagination"></div>
    </swiper>

    亲测有效

  • 相关阅读:
    准确率99.9%的离线IP地址定位库
    手写一个消息队列以及延迟消息队列
    rabbitmq介绍
    污点和亲和力高级调度方式
    ceph
    Vue作业
    label和labelSeletor
    http状态简记
    数据库
    作业
  • 原文地址:https://www.cnblogs.com/_error/p/9089322.html
Copyright © 2011-2022 走看看