vue项目中导入swiper插件的方法
安装-------- npm i [email protected] -S
swiper的使用方法分为3个流程：
1、加载插件
2、HTML内容
3、初始化Swiper
我也按照这个流程编写组件：
1、加载插件
import Swiper from ‘swiper’;
import ‘swiper/dist/css/swiper.min.css’;
2、HTML内容
3、初始化Swiper
因为dom渲染完成才能初始化Swiper，所以必须将初始化放入vue的生命周期钩子函数mounted中：
mounted(){
var mySwiper = new Swiper(’.swiper-container’, {})
}
完成
将以上的代码合并起来：
运行，你看可以实现轮播图的效果了。但是到此为止只实现了轮播的效果，还没有对数据的渲染。