现在时间是:
当前位置:首 页 >> 网站开发>> 文章列表

微信小程序view左右滑动page+-1

作者:   发布时间:2018-08-30 16:23:39   浏览次数:163

https://blog.csdn.net/qq_18325731/article/details/75394032

 

//index.js
var time = 0;
var touchDot = 0;//触摸时的原点
var interval = "";
Page({
onLoad: function () {
var that = this
},
onShow: function () {
clearInterval(interval); // 清除setInterval
time = 0;
},
// 触摸开始事件
touchStart: function (e) {
touchDot = e.touches[0].pageX; // 获取触摸时的原点
// 使用js计时器记录时间
interval = setInterval(function () {
time++;
}, 100);
},
// 触摸结束事件
touchEnd: function (e) {
var touchMove = e.changedTouches[0].pageX;
// 向左滑动
if (touchMove - touchDot <= -40 && time < 10 ) {

//执行切换页面的方法
console.log("向右滑动page+1");
// wx.navigateTo({
// url: '../right/right'
// })
}
// 向右滑动
if (touchMove - touchDot >= 40 && time < 10 ) {

//执行切换页面的方法
console.log("向左滑动page-1");
// wx.navigateTo({
// url: '../left/left'
// })
}
clearInterval(interval); // 清除setInterval
time = 0;
}
})


<!--index.wxml-->
<view bindtouchstart="touchStart" bindtouchend="touchEnd">
滑动切换页面
滑动切换页面
滑动切换页面
滑动切换页面
滑动切换页面
滑动切换页面
滑动切换页面
滑动切换页面
滑动切换页面
滑动切换页面
滑动切换页面
</view>

 






上一篇:没有了    下一篇:没有了

Copyright ©2018    易一网络科技|www.yeayee.com All Right Reserved.

技术支持:自助建站 | 领地网站建设 |短信接口 版权所有 © 2005-2018 lingw.net.粤ICP备16125321号 -5