vue-awesome-swiper

用多个swiper要用不同的instanceName来区分

<div v-swiper="swiperOption" :instanceName="`swiper${item.id}`">
  <div class="swiper-button-prev"></div>
  <div class="swiper-wrapper">
    <div class="swiper-slide blist_subList" v-for="ele in item.children" :key="ele.id">
      <div @click="opendChannelDetail(ele.channelId)" flex="dir:top cross:center" flex-box="0">
        <div class="blist_subList_name">
          {{ ele.name }}
        </div>
      </div>
    </div>
  </div>
  <div class="swiper-button-next"></div>
</div>
                        

import Vue from 'vue'
import VueAwesomeSwiper from 'vue-awesome-swiper'
import 'swiper/swiper-bundle.css'

Vue.use(VueAwesomeSwiper)

import Swiper2, { Navigation, Autoplay, EffectCoverflow } from 'swiper'

Swiper2.use([Navigation, Autoplay, EffectCoverflow])

swiperOption: {
   loop: false,
   slidesPerView: 'auto',
   spaceBetween: 10,
   autoplay: false,
   navigation: {
     nextEl: '.swiper-button-next',
     prevEl: '.swiper-button-prev'
   }
}
     

版本是 "swiper": "6.4.8", "vue-awesome-swiper": "^4.1.1",