小程序中轮播页面的实现

xiaoxiao2023-11-15 157

在index.js中添加以下代码 Page({ data: { motto: ‘Hello World’, imgUrls: [ ‘/images/swiper_01.jpg’, ‘/images/swiper_02.jpg’, ‘/images/swiper_03.jpg’, ‘/images/swiper_04.jpg’, ], indicatorDots: true, autoplay: true, // 轮播图自动播放 circular: true, interval: 3000, duration: 1000, moves: [], // 当前热映相关数据 } }）在index.wxml中添加

即可以实现实现后的页面如图 ![在这里插入图片描述](https://img-blog.csdnimg.cn/20190525202312725.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzkwNDQ2NQ==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/20190525202320331.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzkwNDQ2NQ==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/20190525202325567.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzkwNDQ2NQ==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/20190525202332161.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzkwNDQ2NQ==,size_16,color_FFFFFF,t_70) 自动轮播

最新回复(0)