uni-app中uni-segmented-control样式不生效的根本原因是scoped隔离与!important覆盖，需用/deep/或::v-deep穿透；App端须手写view+text或改用uni-data-checkbox；current须用:Number绑定且监听@change和@click；卡顿多因内容区v-if频繁销毁，建议v-show+key优化。
uni-app里用uni-segmented-control改样式总不生效？
根本原因是它内部用slot包裹内容，但默认样式被scoped隔离了，且组件自身设了!important覆盖逻辑。直接在父组件写.uni-segmented-control__item类基本没用。
- 必须用
/deep/（H5/微信小程序）或::v-deep（uni-app 3.0+）穿透作用域，例如：.uni-segmented-control /deep/ .uni-segmented-control__item { background: #f0f0f0; } - App端（iOS/Android）不支持
/deep/，得改用globalStyle或直接替换组件源码（见下一条） - 如果只是想换颜色、字体大小，优先改
current-color和background-color两个属性，其他样式容易被组件内联样式顶掉
uni-app自定义SegmentedControl要兼容App端怎么办
App端的uni-segmented-control是原生渲染，DOM结构和H5完全不同，CSS穿透完全失效。这时候不能硬改样式，得换思路。
- 方案一：用
view+text手写一个，通过v-for和@click控制current状态，样式完全自主 - 方案二：用
uni-app官方推荐的uni-data-checkbox替代（需搭配mode="segment"），它对App支持更稳 - 方案三：升级到
uni-app x，用SegmentedControl原生组件（仅限App/H5，不支持小程序）
为什么current切换后UI没反应？
常见于手动赋值current但没触发响应式更新，或者change事件没监听对。
-
current是Number类型，不是String，写成current="1"会失效，必须:current="1"或v-model="currentIndex" - 别只监听
@change，App端有时触发的是@click，建议两个都绑，或者统一用v-model - 如果数据来自
vuex或pinia，确保是响应式对象，不要直接赋值state.current = 2，要用commit或store.xxx = 2
性能差、滑动卡顿怎么优化
分段器本身很轻量，卡顿往往来自外部干扰：比如每个tab里塞了大列表、图片未懒加载、或用了v-if频繁销毁重建。
- 用
v-show代替v-if切换内容区，避免重复渲染 - 每个
tab页的内容区域加key，比如:key="current"，防止Vue复用错误节点 - 如果某页有长列表，务必加
virtual-list或启用scroll-y+lower-threshold做懒加载 - H5端慎用
transform: translateZ(0)强行开启GPU加速——可能引发文字模糊，不如直接关掉过渡动画：animation: none
样式能调出来，不代表所有平台表现一致；App端的“看起来一样”，背后可能是两套完全不同的渲染逻辑。真要全端一致，手写比强改组件更可控。
