SwiftUI自定义Chip按钮选中无响应：如何实现展开显示关闭按钮

你的代码存在三个核心问题，导致点击按钮后没有任何反应：

1. 错误在数据模型中使用@Binding #

@Binding是视图间传递状态的工具，不应该放在数据结构体（RCHChip）内部。把@Binding放在模型里会导致状态管理混乱，无法正确同步视图更新。

2. 传递给子视图的是对象副本 #

原代码中rchChip.first(where: {$0.id == chip.id})获取的是数组元素的值类型副本，修改副本的isSelected不会影响原数组中的元素，自然无法触发视图刷新。

3. 闭包中修改的是副本而非原对象 #

原代码里chip.isSelected = true修改的是ForEach循环生成的临时副本，不是原数组中的真实元素，点击动作无法改变实际状态。

修正后的完整代码 #

第一步：重构数据模型

移除@Binding，让RCHChip成为普通的数据结构体：

struct RCHChip: Identifiable {
    let id: String
    let title: String
    var isSelected: Bool
    
    init(id: String = UUID().uuidString, title: String, isSelected: Bool = false) {
        self.id = id
        self.title = title
        self.isSelected = isSelected
    }
}

第二步：修改子视图，使用绑定传递状态

让RCHChipView直接接收绑定的RCHChip对象，确保能修改原数据：

struct RCHChipView: View {
    @Binding var chip: RCHChip
    
    var body: some View {
        HStack(spacing: 0) {
            Button {
                chip.isSelected = true
            } label: {
                Text(chip.title)
            }
            if chip.isSelected {
                Button {
                    chip.isSelected = false
                } label: {
                    Image("NavigationCloseIcon")
                        .resizable()
                        .frame(width: 16, height: 16) // 可根据需求调整图标大小
                }
            }
        }
    }
}

第三步：父视图正确传递绑定数组

使用ForEach($chips)直接遍历绑定数组，确保子视图能修改原数据：

struct ContentView: View {
    @State private var chips: [RCHChip] = [
        RCHChip(title: "Datum"),
        RCHChip(title: "Person"),
        RCHChip(title: "Third") // 新增第三个按钮
    ]
    
    var body: some View {
        HStack {
            ForEach($chips) { $chip in
                RCHChipView(chip: $chip)
            }
        }
    }
}

内容的提问来源于stack exchange，提问作者user20273483