SwiftUI 如何在新视图中链接 ForEach 索引和照片索引？答案

【问题标题】：SwiftUI How to link ForEach index and photos index in the new view?SwiftUI 如何在新视图中链接 ForEach 索引和照片索引？
【发布时间】：2020-12-09 16:48:10
【问题描述】：

如何在新视图中链接forEach 索引和photos 索引？尝试通过按钮打开新视图。这个新的 View 有一个 carouselList，就是由这个结构创建的。通过 NavigationLink 打开视图时，carouselList 中的所有照片都正确显示，具体取决于索引，但不适用于按钮，始终打开第一个索引。

 struct Catalog: View {
 @State private var isOpen = false
 var shop: Shop = shops[0]
 var picture: Picture = pictures[0]

 var body: some View {           
 ScrollView(.vertical, showsIndicators: false) {
            VStack(spacing: 0) {
                ScrollView(.horizontal, showsIndicators: false) {
                    HStack {
                        ForEach(0..<shops.count, id: \.self) { index in
                            Button(action: {
                                self.isOpen.toggle()
                            }) {
                                ShopItem(shop: shops[index])
                            } .sheet(isPresented: $isOpen) {
                                PictureItem(picture: pictures[index])
                            }
                        }
                    }
                    .padding(.top, 10)
                }
            }
        }

【问题讨论】：

标签： swiftui

【解决方案1】：

这是因为 .sheet 修饰符只能在每个视图中放置一次。因此，当您拥有此代码时，它仅在第一个循环中配置 .sheet 。我建议对这种类型的 segue 使用 NavigationLink。

如果您需要强制执行此操作，您可以通过 (1) 将 .sheet 移到 ForEach 之外，(2) 为所选图片创建一个 @State 变量，(3) 在切换 isOpen 之前更新按钮中的该变量，然后在您的 PictureItem 中为所选变量使用 @Binding。像这样：

struct Catalog: View {
    
    @State private var isOpen = false
    var shops: [String] = ["One", "two", "three"]
    var shop: String = "ONE"
    var pictures: [String] = ["one", "two", "three"]
    @State var picture: String = "PIC ONE"
    
    var body: some View {
        ScrollView(.vertical, showsIndicators: false) {
            VStack(spacing: 0) {
                ScrollView(.horizontal, showsIndicators: false) {
                    HStack {
                        ForEach(0..<shops.count, id: \.self) { index in
                            Button(action: {
                                self.picture = pictures[index]
                                self.isOpen.toggle()
                            }) {
                                Text(shops[index])
                            }
                        }
                    }
                    .padding(.top, 10)
                }
                .sheet(isPresented: $isOpen) {
                    PictureItem(string: $picture)
                }
            }
        }
    }
}

struct PictureItem: View {
    
    @Binding var string: String
    
    var body: some View {
        Text(string)
    }
}

旁注：根据您的按钮，图片和商店数组似乎是相关的，应该放在一起。

【讨论】：