如何用ForEach按钮组替代SwiftUI Segmented Picker实现地图类型切换

安全阿岳

2026-8-14

问题分析与修复方案

你的代码主要有3个核心错误：

ForEach数据源错误：你传入的$appVM.mapType是单个绑定值（当前选中的地图类型），但ForEach需要遍历所有可选的地图类型数组，而不是单个值，这直接导致循环无法生成按钮组。
onChange用法错误：onChange(of:)参数应该传具体值（比如appVM.mapType）而非Binding，而且按钮点击时直接更新mapType即可，不需要在onChange里重复赋值。
冗余布局嵌套：多层嵌套的VStack/HStack完全没必要，只会增加代码复杂度。

修复后的完整代码

首先，先定义所有可选的地图类型数组（可以放在ViewModel或者当前视图里）：

// 定义所有地图类型选项
let mapTypeOptions: [(label: String, value: String)] = [
    ("Standard", "standard"),
    ("Image", "image"),
    ("Hybrid", "hybrid")
]

然后用ForEach遍历数组生成按钮组，同时模拟分段选择器的选中样式：

HStack(spacing: 0) {
    ForEach(mapTypeOptions, id: \.value) { option in
        Button(action: {
            appVM.mapType = option.value
            print("User has selected \(option.label) map type.")
            log.info("The new map type is: \(option.value)")
        }) {
            Text(option.label)
                .frame(maxWidth: .infinity)
                .padding(.vertical, 8)
                .foregroundColor(appVM.mapType == option.value ? .white : .blue)
                .background(appVM.mapType == option.value ? .blue : .clear)
                .cornerRadius(8)
        }
        .buttonStyle(.plain)
    }
}
.padding(.horizontal)