版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/shelbyandfxj/article/details/83089741
1、npm install swipper -dev--save
2、在main.js中引入swiper的样式文件: import 'swiper/src/swiper.less';
3、在所使用的页面中的结构是:
<template>
<div class="home_banner">
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide">
<img src="">
</div>
<div class="swiper-slide">
<img src="">
</div>
<div class="swiper-slide">
<img src="">
</div>
</div>
</div>
</div>
</template>
<script>
export default {
name: '',
data () {
swiper: null
},
mounted () {
this._initSwiper();
},
methods: {
_initSwiper () {
this.swiper = new Swiper('.swiper-container', {
freeMode: true,
freeModeMomentum: false
})
}
}
</script>