vue2.0如何使用swiper实现轮播广告功能-创新互联

小编给大家分享一下vue2.0如何使用swiper实现轮播广告功能，希望大家阅读完这篇文章后大所收获，下面让我们一起去探讨吧！

1、安装swiper

npm install swiper@3.4.1 --save-dev

2、引用组件

import Swiper from 'swiper';
import 'swiper/dist/css/swiper.min.css';

3、html页面代码

4、初始化组件，并设置参数

setTimeout(function () {
  state.swiperObj = new Swiper('#swiper', {
  loop: true,
  pagination: '.swiper-pagination',
  autoplay: 2000,
  paginationClickable: true
  });
 }, 100)

看完了这篇文章，相信你对vue2.0如何使用swiper实现轮播广告功能有了一定的了解，想了解更多相关知识，欢迎关注创新互联网站制作公司行业资讯频道，感谢各位的阅读！