核心原因是Bootstrap用估算的padding-right补偿滚动条宽度，估算不准导致页面内容向左抽动；仅当页面原无滚动条或滚动条宽度动态变化时才明显闪烁。
禁用滚动条闪烁的核心是绕过 Bootstrap 的滚动条宽度补偿逻辑，而不是强行覆盖 padding-right 或 overflow —— 否则会引发左移、抖动、多层 modal 失控等连锁问题。
为什么加了 modal-open 会“闪”一下
Bootstrap 在 show 时给 body 加 modal-open 类，同时执行两件事：overflow: hidden（隐藏滚动条） + 动态设置 padding-right 补偿消失的滚动条宽度。但这个宽度是估算值（比如硬写 17px），而真实滚动条宽度因系统、缩放、是否启用 overlay 滚动而异（macOS 隐藏滚动条时可能为 0）。估算不准 → 右侧 padding 突然变大 → 页面内容向左“抽”一下，视觉上就是“闪烁”。
- 不是所有页面都会闪：只有原本没滚动条（
document.body.scrollHeight ）的页面才明显 - 移动端 Safari 更容易闪，因为
vh计算不稳定，且滚动条行为更隐蔽 - 如果用了
scrollbar-width: none或overlay-scrollbars，Bootstrap 的检测直接失效，补偿变成纯干扰
data-bs-backdrop="static" 是最轻量的解法
这个属性不只影响点击遮罩关闭行为，它会跳过整个滚动条补偿流程：不加 modal-open、不设 padding-right、不改 body 的 overflow —— 但模态框仍能正常显示和交互。
- 适用场景：权限确认、提示弹窗、单次操作反馈等「不需要点背景关闭」的 modal
- 副作用：ESC 键仍可关闭，不影响键盘操作；若需支持点击遮罩关闭，此方案不可用
- 注意：不要和
data-bs-keyboard="false"混用，否则 ESC 也关不了，用户无法退出
需要点击遮罩关闭？手动接管滚动状态
必须保留点击 backdrop 关闭能力时，就不能依赖 Bootstrap 自动补 padding，得自己控制 overflow 和类名同步：
- 监听
show.bs.modal事件，执行document.body.style.overflow = 'hidden'，但 不加modal-open类 - 监听
hidden.bs.modal事件，恢复document.body.style.overflow = ''（别用'auto'，避免重绘） - 如果页面有 fixed 定位元素（如顶部导航栏），它们不会自动继承 body 的 padding 补偿，需额外加
.is-fixed类让 Bootstrap 内部逻辑生效 - 多层 modal 场景下，用
$('.modal.show').length判断是否还有 visible modal，而不是查modal-open类是否存在
第三方滚动库（如 overlay-scrollbars）冲突时怎么办
这类库会接管原生滚动容器，导致 document.body.offsetWidth - document.documentElement.clientWidth 返回 0，Bootstrap 就以为“没滚动条”，不补偿 → 实际却隐藏了滚动条 → 页面宽度突变 → 闪。
- 最稳做法：在初始化第三方滚动库后，手动调用其 API 获取真实滚动条宽度，并 patch Bootstrap 的
getScrollbarWidth方法 - 快速临时方案：全局禁用 Bootstrap 补偿，加
data-bs-backdrop="static"到所有 modal，再用 CSS 强制html, body { overflow: hidden }（仅限单层 modal 场景） - 绝对不要在 CSS 里写
body { padding-right: 0 !important }—— 这会破坏所有依赖modal-open的样式钩子
真正难处理的从来不是“怎么禁滚动”，而是“怎么让禁滚动这件事不被页面其他部分感知”。modal-open 是个契约，不是开关；绕过它比修它更可靠，前提是清楚代价在哪。
