移动端多级联选器平滑滚动必须用 js 主动控制 scrollintoview 或 scrollto，因 scroll-behavior: smooth 对自定义滚动容器无效、ios safari 15.4 前不支持、微信 x5 内核静默降级。
移动端多级联选器的平滑滚动选择，不能靠 scroll-behavior: smooth 实现——它对自定义滚动容器（比如弹层里的 .picker-column）完全无效，且 iOS Safari 15.4 之前压根不支持该属性，微信 X5 内核还会静默降级。必须用 JS 主动控制 + 容器级 scrollIntoView 或 scrollTo。
为什么给 picker 容器加 scroll-behavior: smooth 没用
多级联选器通常是绝对定位弹层，内部每个列（.column）自己是独立的可滚动容器：overflow-y: auto + 固定高度。此时 scroll-behavior 必须显式写在每个列容器上，而不是 html 或外层弹窗上。
-
scroll-behavior不继承，父元素设了，子列滚动仍为瞬时 - iOS Safari ≤15.3 完全忽略该声明；15.4–16.0 支持极不稳定，常卡顿或跳帧
- 微信 Android WebView 默认禁用平滑滚动，即使 CSS 写对也无动画
- 如果列用了
-webkit-overflow-scrolling: touch（旧式弹性滚动），会直接禁用scroll-behavior
用 element.scrollIntoView({ behavior: 'smooth' }) 真正生效的条件
这是目前最可靠的方式，但调用时机和目标必须精准，否则滚动错位、不动或报错。
- 目标项（如
.option[data-value="2"]）必须已渲染完成，避免offsetTop为 0：用requestAnimationFrame包一层再执行 - 必须对列容器内的目标元素调用，不是
window或document.scrollingElement：targetOption.scrollIntoView({ behavior: 'smooth', block: 'center' }) - 列容器需有明确高度和
overflow-y: auto，否则scrollIntoView无法计算滚动上下文 - iOS Safari 15.4 以下会静默降级为瞬时滚动，检测方式应为：
typeof Element.prototype.scrollIntoView === 'function' && 'behavior' in ScrollIntoViewOptions.prototype
安卓 WebView 和微信 X5 的兼容性陷阱
它们常把 behavior: 'smooth' 当作非法参数忽略，不报错，但滚动变成硬跳——你看到的是“啪”一下到位。
- 别用
'scrollBehavior' in document.documentElement.style判断，这只能测 CSS 属性，不能反映 JS API 是否可用 - 真实检测建议：创建临时元素，调用
el.scrollIntoView({ behavior: 'smooth' })，监听其父容器scroll事件是否在 100ms 内连续触发（平滑滚动会发多次） - 微信 Android WebView 需初始化时调用
webSettings.setSmoothScrollingEnabled(true)；iOS 无对应 API，只能靠 JS 降级 - 降级方案建议用
scrollTo+requestAnimationFrame实现匀速缓动，避免依赖原生behavior
真正麻烦的不是怎么写 smooth，而是滚动目标是否已挂载、容器是否被 transform 隔离、用户是否开了 prefers-reduced-motion——这些都会让平滑失效且不报错，只能靠运行时检测+渐进增强兜底。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
