禁用页面左右滑动需分平台处理:ios 唯一有效方式是 pages.json 中页面级 style 下配置 "app-plus": {"popgesture": "none"};android 需在 onbackpress 中返回 true 拦截物理键/侧滑,弹窗场景须用 setstyle 动态开关。

uni-app 禁止页面左右滑动,核心是关掉 iOS 的侧滑返回手势(Android 无原生侧滑返回,但部分厂商系统或 WebView 层会模拟),popGesture 是唯一稳定生效的控制点,其他方式如拦截事件、CSS 阻断均无效。
pages.json 中配 popGesture 是最可靠入口
iOS 侧滑返回是系统级行为,JS 层收不到 touchstart 或 swipe 事件,onBackPress 在 iOS 上完全不触发。想真正禁用,只能从原生 Webview 层下手——而 pages.json 的 app-plus.popGesture 是 uni-app 官方文档确认、实测唯一稳定的配置位置。
- 只接受两个值:
"close"(默认,侧滑即关闭页面)和"none"(彻底禁用,无响应) -
"hide"、"disable"、大小写混用(如"None")全部无效 - 必须写在页面级
style下,不能只写在globalStyle;全局禁用需改manifest.json的app-plus节点 - 示例(仅对详情页生效):
{
"path": "pages/detail/detail",
"style": {
"app-plus": {
"popGesture": "none"
}
}
}
安卓需额外处理 onBackPress 才算真正拦截
安卓平台所有返回动作(物理键、虚拟导航栏、侧滑手势)最终都会走到 onBackPress 生命周期钩子,但它的返回值决定是否拦截:
- 返回
true:原生返回逻辑终止,页面不退 - 返回
false或不返回:放行,继续回退 -
options.from可区分来源:"backbutton"(物理键/侧滑)或"navigateBack"(JS 主动调用) - 典型写法(只拦物理返回和侧滑,放行 JS 调用):
onBackPress((options) => {
if (options.from === 'backbutton') {
return true;
}
return false;
})
弹窗场景必须用 setStyle 动态开关
配置文件只控制页面加载时的状态,弹窗打开/关闭是运行时行为,必须用 JS 实时修改 Webview 样式,否则用户在弹窗里一划,直接退回上一页。
- 获取当前 webview:
this.$mp.page.$getAppWebview()(Vue2/Vue3 均适用) - 弹窗打开时设
{ popGesture: 'none' },关闭时务必恢复为{ popGesture: 'close' } -
setStyle是异步操作,无回调;不能只在 open 里关,漏掉 close 里的恢复,后续页面就再也侧滑不回去了
别碰 disableSwipeBack 和 CSS 方案
pages.json 中的 disableSwipeBack 仅在部分 iOS 小程序环境有效,在 APP-PLUS 平台基本不生效;用 overflow: hidden、touch-action: none 或监听 touchmove 阻止默认行为,对 iOS 侧滑返回完全无效——它根本不是页面 DOM 事件,而是原生 Webview 的手势识别层。
真正要禁用,只认 popGesture 这个开关,且必须分清平台差异、静态配置与动态控制的边界。漏掉安卓的 onBackPress 或弹窗后的样式恢复,都会导致行为不一致。











