一、在vue项目中安装swiper
npm install swiper -S
二、在main.js中引入swiper.css
import Vue from 'vue';
import "swiper/swiper.min.css"
三、在需要使用swiper的组件中引入swiper ,swiper必须放到mounted里 否在无效
<script>
import Swiper from 'swiper';
export default {
name: 'HelloWorld',
data () {
return {
msg: 'Welcome to Your Vue.js App'
}
},
mounted(){
new Swiper ('.swiper-container', {
loop: true,
pagination: '.swiper-pagination',
nextButton: '.swiper-button-next',
prevButton: '.swiper-button-prev',
scrollbar: '.swiper-scrollbar',
})
}
}
</script>
四、在需要的