如何通过 NavigationLink 将 ForEach 变量传递到 Binding 中

Question

所以我有这个代码：

struct SelectorView: View {

    let levelamt: Int = 50
    var next: Int = 20
    let columns: [GridItem] = [GridItem(), GridItem(), GridItem()]

    var body: some View {
        NavigationStack {
            ZStack {
                Color(red: 0, green: 0, blue: 0).ignoresSafeArea()
                LazyVGrid(columns: columns) { 
                    ForEach(1..<next, idx: \.self) { x in
                        NavigationLink(destination: GameView(level: self.x), label: {
                            ZStack {
                                Image("Fragment")
                                    .resizable()
                                    .frame(width: 125, height: 125)
                                    .scaledToFit()
                                Text(String(x))
                                    .font(.system(size: 50, design: .monospaced))
                                    .fontWeight(.bold)
                                    .foregroundColor(Color.white)
                                }
                            })
                        }
                    }
                }
            }
        }
    }
}

它表示 x 无法传递到 GameView 的 Binding Int 级别。 有人可以告诉我这是如何工作的以及如何解决它吗？

这是 GameView 代码（它没有任何内容，因为我还没有接触到它）：

struct GameView: View {

    @Binding var level: Int

    var body: some View {

        Text("hello world")

    }
}

我使用的是旧版本的NavigationLink，因为我个人觉得它更方便编码。当我完成应用程序时，我会研究它并对其进行优化。 我也看过其他类似的帖子，但这些帖子的解决方案由于某种原因不起作用，可能是因为 ForEach 是一个范围而不是数组。

Answer 1

尝试使用单独的

struct GameItem

来保持游戏关卡的方法，并且 在

$

循环中使用绑定 (

ForEach()

)。

如上所述，您不应在

ForEach()

中使用索引。

struct GameItem: Identifiable {  // <--- here
    let id = UUID()
    var level: Int
}

struct SelectorView: View {
    
    let levelamt: Int = 50
    var next: Int = 20
    let columns: [GridItem] = [GridItem(), GridItem(), GridItem()]
    
    // for testing
    @State private var items = [GameItem(level: 0),GameItem(level: 1),GameItem(level: 2)]
    
    var body: some View {
        NavigationStack {
            ZStack {
                Color(red: 0, green: 0, blue: 0).ignoresSafeArea()
                LazyVGrid(columns: columns) {
                    ForEach($items) { $item in // <--- here $
                        NavigationLink(destination: GameView(level: $item.level), label: { // <--- here
                            ZStack {
                                Image("Fragment")
                                    .resizable()
                                    .frame(width: 125, height: 125)
                                    .scaledToFit()
                                Text(String(item.level)) // <--- here
                                    .font(.system(size: 50, design: .monospaced))
                                    .fontWeight(.bold)
                                    .foregroundColor(Color.white)
                            }
                        })
                    }
                }
            }
        }
    }
}


struct GameView: View {
     @Binding var level: Int  
    
    var body: some View {
        Text("GameView \(level)") // <--- for testing
    }
}

struct ContentView: View {
    var body: some View {
        SelectorView()
    }
}