Swiper中文论坛

标题: vue SPA同一页面多个组件使用swiper,按钮互串 [打印本页]

作者: 黑山老妖    时间: 2019-4-2 11:39
标题: vue SPA同一页面多个组件使用swiper,按钮互串
同一页面,多个组件中都使用了swiper组件,但是当改变swiper左右前进按钮的时候,会引发多个swiper互串,一个按钮控制多个swiper组件内块的滑动
  1. <swiper :options="swiperOption">
  2.             <swiper-slide>
  3.    
  4.             </swiper-slide>
  5.             <div class="swiper-pagination"  slot="pagination"></div>
  6.             <div class="swiper-button-prev" slot="button-prev">
  7.                 <i class="ivu-icon ivu-icon-ios-arrow-back"></i>
  8.             </div>
  9.             <div class="swiper-button-next" slot="button-next">
  10.                 <i class="ivu-icon ivu-icon-ios-arrow-forward"></i>
  11.             </div>
复制代码
  1. <div class="swiper-wrap">
  2.         <swiper :options="swiperOption" ref="mySwiper">
  3.             <swiper-slide >
  4.                
  5.             </swiper-slide>
  6.             <div class="swiper-pagination"  slot="pagination"></div>
  7.         </swiper>
  8.         <div class="swiper-button-prev" slot="button-prev">
  9.             <i class="ivu-icon ivu-icon-ios-arrow-back"></i>
  10.         </div>
  11.         <div class="swiper-button-next" slot="button-next">
  12.             <i class="ivu-icon ivu-icon-ios-arrow-forward"></i>
  13.         </div>
  14.     </div>
复制代码
第一个和第二个swiper的  swiper-button-next和swiper-button-prev会相互控制





欢迎光临 Swiper中文论坛 (http://bbs.swiper.com.cn/) Powered by Discuz! X3.2