所属分类:php教程
轮播图:swiper滑块视图容器。
1.编写页面结构
pages/index/index.wxml
登录后复制
注意:不要在view中加css设置:display: flex;否则效果呈现不了
2.设置数据
了解属性,方可设置
程序员必备接口测试调试工具:立即使用
Apipost = Postman + Swagger + Mock + Jmeter
Api设计、调试、文档、自动化测试工具
后端、前端、测试,同时在线协作,内容实时同步
<swiper/>
组件中,宽高自动设置为100%。在index.js中设置数据
//index.js
//获取应用实例
var app = getApp()
Page({
data: {
imgUrls: [ {
link:'/pages/index/index',
url:'../uploads/a01.jpg'
},{
link:'/pages/logs/logs',
url:'../uploads/a02.jpg'
},{
link:'/pages/user/user',
url:'../uploads/a03.jpg'
}
],
indicatorDots: true,
autoplay: true,
interval: 5000,
duration: 1000
}
})
登录后复制
3.效果
相关推荐:
react轮播图组件react-slider-light详解
jquery实现PC端轮播图代码
两种js实现轮播图的方式
以上就是微信小程序轮播图功能开发实例的详细内容,更多请关注zzsucai.com其它相关文章!