vue中引入swiper插件

这里我们使用npm的方式安装swiper插件。

1.npm install vue-awesome-swiper --save

2.在main.js文件中引入文件

import Vue from 'vue'

import  VueAwesomeSwiper from  'vue-awesome-swiper'

3.然后注册全局的swiper

Vue.use(VueAwesomeSwiper)

4.在模板中使用

//引入swiper.css
require('swiper/dist/css/swiper.css')

import  { swiper, swiperSlide } from  'vue-awesome-swiper'

 

export  default  {

   components: {

     swiper,

     swiperSlide

   }

}

5.swiper的js设置直接写在直接放在 mounted 中处理。