vue中使用vue-awesome-swiper自定义按钮

vue中使用vue-awesome-swiper实现轮播记录

vue-awesome-swiper安装

npm install vue-awesome-swiper --save

安装好之后,在main.js文件中导入

import VueAweSomeSwiper from 'vue-awesome-swiper'
import 'swiper/dist/css/swiper.css'

Vue.use(VueAweSomeSwiper)

然后在组件中就可以使用了
dom


js


css

//  这里去掉了scoped ,而且一定要去掉,本人亲自尝试,就因为这点,来来回回折腾了快一天

最重要的就是,一定不要加scoped,另外去掉scoped的话样式是对全局生效的,所以要注意自定义样式的命名

\color{red}{最后提醒,使用vue-awesome-swiper也是参照了swiper轮播的写法,所以如果用swiper插件的话,写法跟这个一样}

问题1:

有时候点击分页器,轮播就不能继续了,根本原因是是少了一个属性

autoplay: {
  delay: 5000,
//加上这句就好了
  disableOnInteraction: false
},

你可能感兴趣的:(vue中使用vue-awesome-swiper自定义按钮)