Swipper 控制器拇指在循环中滑动(异步)

作者: dudenk创建于 2018年2月17日更新于 2023年1月26日
标签TBC

data() { return { swiperOptionTop: { spaceBetween: 10, navigation: { nextEl: '.swiper-button-next', prevEl: '.swiper-button-prev' }, }, swiperOptionThumbs: { spaceBetween: 10, centeredSlides: false, slidesPerView: 'auto', touchRatio: 0.2, slideToClickedSlide: true }, swiperSlides: [ { id: 1, img: '/static/images/products/product_01.jpg' }, { id: 2, img: '/static/images/products/product_02.jpg' }, { id: 3, img: '/static/images/products/product_03.jpg' } ], swiperSlidesThumb: [ { id: 1, img: '/static/images/products/product_01.jpg' }, { id: 2, img: '/static/images/products/product_02.jpg' }, { id: 3, img: '/static/images/products/product_03.jpg' } ] } }, mounted() { this.$nextTick(() => { const swiperTop = this.$refs.swiperTop.swiper; const swiperThumbs = this.$refs.swiperThumbs.swiper; swiperTop.controller.control = swiperThumbs; swiperThumbs.controller.control = swiperTop; }) }

内容来源: surmon-china/vue-awesome-swiper