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 中處理。