一：引言

uniapp开发过程中，我们发现页面长按会触发回弹效果，那么有那些解决方式呢？

二：方式

（1）：全局配置禁用回弹

1：场景=>完全禁用整个页面的弹性滑动效果

2：代码：在pages.json中

"globalStyle": {  
  "app-plus": {  
    "bounce": "none"  // 关闭所有页面的回弹效果  
  }  
}  

3：兼容性：APP端生效

（2）：单页页面禁用

1：代码

{  
  "path": "pages/demo/demo",  
  "style": {  
    "app-plus": {  
      "bounce": "none"  // 仅当前页面生效  
    }  
  }  
}  

（3）：局部组件

1：场景=>特定滚动区域需禁用回弹，同时保留其他区域交互

2：代码

<scroll-view 
  :bounces="false"    // 关闭回弹 
  :enhanced="true"    // 启用增强模式 
  scroll-y  
>  
  <!-- 内容区域 -->  
</scroll-view>  

3：兼容性：仅该容器内滑动无回弹

（4）：css强制限制溢出

1：代码

.no-bounce-container {  
  overscroll-behavior: none;  // 禁止过界滚动反馈  
  -webkit-overflow-scrolling: auto;  // 禁用 iOS 弹性滚动  
}  

三：ios/H5方案

（1）：添加全局样式

1：场景=>ios或者H5页面边缘回弹

2：代码

body, html {  
  overflow: hidden;  // 禁用全局滚动条  
  height: 100vh;     // 固定高度  
}  

（2）：拦截触摸事件

1：代码

document.addEventListener('touchmove', function(e) {  
  e.preventDefault();  // 阻止默认滑动行为  
}, { passive: false });  

2：兼容性：慎用，可能影响页面内正常滚动

四：总结

‌1：下拉刷新冲突‌：若页面需保留下拉刷新功能，禁用回弹时需同步设置 enablePullDownRefresh: true 并调整阈值‌

2：动态弹窗处理‌：弹窗内的滚动区域需独立设置 overscroll-behavior: contain，避免穿透到主页面‌