vue中引入swiper插件

Posted 2020-10-14 亦心晗

这里我们使用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 中处理。