这个轮播图功能的代码,为了方便发布,我全部放在了html文件中。
基于vue实现的,无第三方插件。
后期可以将部分html和js拆出来,做轮播组件
data里定义的轮播图属性
// 图片宽 imgWidth:750, // 指示器 dots:true, arrow:true, // 初始播放位置 initIndex:0, // 是否循环 loop:true, // 持续时间 duration:0.3, // 自动播放 auto:true,
如上可以配置的参数以及图片位移可以通过组件通信传递。
如有需要组件化开发(.vue文件格式)的代码,可以评论,我回复封装拆分方法