vue-awesome-swiper滑块插件使用方法详解

2020-06-16 05:44:34易采站长站整理

// swiper的各种回调函数也可以出现在这个对象中,和swiper官方一样
// onTransitionStart(swiper){
// console.log(swiper)
// },
// more Swiper configs and callbacks...
// ...
}
}
},components: {
swiper,
swiperSlide
},
// you can find current swiper instance object like this, while the notNextTick property value must be true
// 如果你需要得到当前的swiper对象来做一些事情,你可以像下面这样定义一个方法属性来获取当前的swiper对象,同时notNextTick必须为true
computed: {
swiper() {
return this.$refs.mySwiper.swiper
}
},
mounted() {
// you can use current swiper instance object to do something(swiper methods)
// 然后你就可以使用当前上下文内的swiper对象去做你想做的事了
// console.log('this is current swiper instance object', this.swiper)
// this.swiper.slideTo(3, 1000, false)
}
}
</script>

根据官方api进行调整

http://www.swiper.com.cn/api/pagination/2016/0126/299.html

我的git demo可以参考 :https://github.com/ssdpj/mk/tree/vue-admine