开发的时候，会遇到产品或者UI发出如下规定：
1、如果是一屏的页面，就禁止页面能上下滑动
2、如果显示弹窗的时候，长屏幕禁止上下滑动！
感叹一句：好变态
当然，感叹归感叹，但是还是得听不是，我找出了3种方式，看看大家喜欢哪个，就用哪个！
第一种方式：
页面最外层的盒子，使用绝对定位！这样页面也就不能滑动了！此方法呢，比较麻烦，写的代码比较多！但是还是能够实现的！源码如下：
position: fixed;
top:0;
left:0;第二种方式：
在微信小程序app.json的window中，添加”disableScroll”:true，但是要注意，如果你是要在app.json中添加disableScroll，会导致所有页面无法上下滑动，这就是个大bug了，解决也很简单，你想在那个页面禁止页面滑动，就在哪个页面的json下，添加disableScroll就可以了，单独设置就行！代码如下：
//app.json中添加，window里面添加就可以了
"window": {
"disableScroll": true
},
//单独设置，比如index下，就在index.json设置
{
"navigationBarTitleText": "首页",
"disableScroll":true
}但是有些时候使用disableScroll并不合适，比如一个长页面，我需要弹窗出来的时候，才禁止上下滑动，弹窗隐藏的时候，又可以上下滑动！那就衍生第三个方式
第三种方式：文章来源：https://www.toymoban.com/news/detail-505279.html
在弹窗的遮罩层或者内容层的view上，添加catchtouchmove=’true’，这个意思就是，你添加了catchtouchmove view的盒子，用户如果在这个盒子滑动的时候，是不能触发滑动效果的，一定要看清楚字面意思，不然会写错view，导致无效果哦！代码如下：文章来源地址https://www.toymoban.com/news/detail-505279.html
//弹窗遮罩层
<view catchtouchmove='true'>
</view>到了这里，关于微信小程序禁止页面上下滑动的三个方式的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
