微信小程序页面左右滑动关闭

Posted 2023-05-06

参考技术A 页面中view设置width:100%之后,页面右边会多出一块白区域,并且可以左右滑动,解决方法是给这个view加一个box-sizing:border-box;
2.
直接给最外层的view设置一个overflow-x:hidden; //裁剪 div 元素中内容的左/右边缘 - 如果溢出元素的内容区域的话进行隐藏
3.
在json文件里面加 "disableScroll": true
4.
给page一个弹性盒子 page width:100%; display: flex; 然后将page下面的根元素盒子宽度设为100%,overflow:

微信小程序——左右滑动切换页面

参考技术A 微信小程序的左右滑动触屏事件，主要有三个事件：touchstart，touchmove，touchend。
这三个事件最重要的属性是pageX和pageY，表示X，Y坐标。
touchstart在触摸开始时触发事件;
touchend在触摸结束时触发事件;
touchmove触摸的过程中不断激发这个事件;
这三个事件都有一个timeStamp的属性，查看timeStamp属性，可以看到顺序是touchstart => touchmove=> touchmove => ··· =>touchmove =>touchend。