общем в инструкции через $refs делается следующее,
components: {
Swiper,
SwiperSlide,
},
data() {
return {
swiperOptionTop: {
loop: true,
loopedSlides: 5,
spaceBetween: 10,
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev'
},
},
swiperOptionThumbs: {
loop: true,
loopedSlides: 5,
spaceBetween: 10,
centeredSlides: true,
slidesPerView: 'auto',
touchRatio: 0.2,
slideToClickedSlide: true,
},
}
},
mounted() {
this.$nextTick(() => {
let swiperTop = this.$refs.swiperTop.$swiper;
let swiperThumbs = this.$refs.swiperThumbs.$swiper;
swiperTop.params.control = swiperThumbs;
swiperThumbs.params.control = swiperTop;
})
},
................. в разметке так
<swiper class="swiper gallery-top" :options="swiperOptionTop" ref="swiperTop">
проблема:
Слайды не завязанны друг на друга несмотря на то что, задан params.control
Если кто то делал, подскажите как поправить. в гугле еще есть вариант
galleryTop.controller.control = galleryThumbs;
galleryThumbs.controller.control = galleryTop
controller undefined пишет
для начала посмотри что лежит в this.$refs.swiperTop, возможно нейминги не те. так как там вышла 6 версия свайпера и они добротно там его переписали, может счего изменили, а с новой версией vue-awesome-swiper много чего не работает из-за этого, и большенство советует откатиться к предыдущей версии
Обсуждают сегодня