SwiftUI中CounterView实例异常：仅最后一个视图加减按钮可用

问题根源 #

你遇到的问题核心在于使用数组索引（data.indices）配合id: \.self作为ForLoop的标识。SwiftUI依赖稳定的唯一标识跟踪视图状态，而索引本身是不稳定的——当数组中值类型元素（Dataa是结构体，属于值类型）的属性修改时，会生成新的实例，此时SwiftUI无法正确关联每个CounterView对应的绑定关系，最终导致只有最后一个视图的交互能触发正确更新。

解决方案 #

由于Dataa已经遵循Identifiable协议（自带唯一UUID类型的id），直接遍历数据数组即可，让ForEach使用元素的唯一id作为视图标识，保证每个CounterView的绑定与对应数据实例稳定关联。

修改后的Home视图代码 #

struct Home: View {
    @State private var data: [Dataa] = MockData.data
    var body: some View {
        NavigationStack{
            ScrollView(.horizontal){
                VStack{
                    HStack{
                        // 直接遍历绑定数组，自动关联元素唯一id
                        ForEach($data) { $item in
                            VStack{
                                CounterView(data: $item)
                            }
                        }
                    }
                }
            }
            .navigationTitle("Home")
            .toolbar{
                ToolbarItem(placement: .topBarLeading){
                    Image("placeholder")
                        .resizable()
                        .frame(width: 65, height: 65)
                        .cornerRadius(3)
                }
            }
        }
    }
}

补充说明 #

如果你需要保留基于索引的遍历逻辑（不推荐，不如上述方案简洁），可以通过元素的id定位索引，避免直接使用data.indices：

ForEach(data) { item in
    if let index = data.firstIndex(where: { $0.id == item.id }) {
        CounterView(data: $data[index])
    }
}

这种写法同样依赖Dataa的唯一id来稳定关联视图与数据，避免索引变化导致的绑定混乱。

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