【相关文章推荐：vue.js】
vue.js中使用swiper的方法：
1、下载swiper.js
npm install vue-awesome-swiper --save
2、在main.js中全局引入swiper.js
import vueawesomeswiper from 'vue-awesome-swiper' import 'swiper/dist/css/swiper.css'vue.use(vueawesomeswiper)
3、在模板中配置相关内容
<template><swiper :options="swiperoption"><swiper-slide v-for="item in imglist"><img :src="rootlink+ '/resources/img/' + item.imgpath"/></swiper-slide><div class="swiper-pagination" slot="pagination"></div></swiper></template><script>import axios from 'axios'export default {name: 'carrousel',data() {return {rootlink: 'http://119.23.28.239:8080',imglist:[],swiperoption: {autoplay: 3000, //l轮播间隔时间loop: true,//是否自动轮播pagination : '.swiper-pagination', //轮播图中下标点显示paginationclickable :true //轮播图中下标点显示} }},mounted() {var vm = this;axios.get(vm.rootlink + '/train/homepage/banner?type=上面').then(function (data) {vm.imglist = data.data.data})}}</script>
相关免费学习推荐：javascript（视频）
以上就是vue.js怎么用swiper的详细内容。