//index.js //获取应用实例 var app = getApp() //var color_index=['green','red','yellow','blue']; Page({ data:{ toview:'red', }, /*滑动到左边触发*/ scrollXToUpper:function(){ console.log('scrollXToUpper') }, /*滑动到右边触发 */ scrollXToLower:function(){ console.log('scrollXToLower') }, /*滑动到顶部触发*/ scrollYToUpper:function(){ console.log('scrollYToUpper') }, /*滑动到左边触发 */ scrollYToLower:function(){ console.log('scrollYToLower') }, /*滑动触发 */ scroll:function(){ console.log("scroll") }, onLoad: function () { console.log('onLoad') var that = this }, })
2.3 滑块视图容器（swiper）
(1)总结
(2)例子
效果图：
page.wxml
<swiper data-current="0" current="0" bindchange="itemChangeFunc" circular="true" indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}"> <block wx:for="{{imgUrls}}" wx:key="swiperkeys"> <swiper-item> <image src="https://www.jb51.net/{{item}}"/> </swiper-item> </block> </swiper>
page.js
//game.js Page({ data: { imgUrls: [ '/image/wechat.png', 'http://img02.tooopen.com/images/20150928/tooopen_sy_143912755726.jpg', 'http://img06.tooopen.com/images/20160818/tooopen_sy_175866434296.jpg', 'http://img06.tooopen.com/images/20160818/tooopen_sy_175833047715.jpg' ], indicatorDots: true, autoplay: true, interval: 3000, duration: 1000, current:1, }, durationChange: function(e) { this.setData({ duration: e.detail.value }) }, durationChange: function(e) { this.setData({ duration: e.detail.value }) }, itemChangeFunc:function(e){ // console.log(e.target.dataset.current) console.log(e.detail) } })