如何为 ForEach 中的每张卡片添加导航链接，以便它们有自己的屏幕可以访问？

Posted 2023-02-24

【中文标题】如何为 ForEach 中的每张卡片添加导航链接，以便它们有自己的屏幕可以访问？

【英文标题】：How do I add a navigation link for each one of the cards in the ForEach so that they have there own screen to go to?

【发布时间】：2021-08-08 06:17:13

【问题描述】：

我已经准备好视图的结构，但我不知道如何让卡片转到该视图。我很新！有人可以帮忙吗？

我的代码：

struct HomeView: View 
        var SolarCards: [String] = ["MercuryCard", "VenusCard", "EarthCard", "MarsCard", "jupiterCard", "saturnCard", "uranusCard", "neptuneCard"]
ScrollView(.horizontal, showsIndicators: false) 
                HStack(spacing: 20) 
                    ForEach(SolarCards, id: \.self)  cards in
                        GeometryReader  geometry in
                             Image(cards)
                            .shadow(color: colorScheme == .dark ? .blue : .purple, radius: 10)
                            .padding(.bottom, 0)
                            .padding(.leading, 10)
                            .rotation3DEffect(Angle(degrees: Double(geometry.frame(in: .global).minX) / -20), axis: (x: 0, y: 10.0, z: 0))
                        
                    
                    .frame(width: 260, height: 400)
                
            

【问题讨论】：

这可能会有所帮助：hackingwithswift.com/quick-start/swiftui/…

我已经为相应的卡片准备了不同的文件，并且这些文件中的结构非常大，那么我该如何链接呢？您发送的视频刚刚显示了文字。

【参考方案1】：

您可以将AnyView 与模型一起使用，并为每个元素设置视图。

这里是演示代码

struct DemoView: View 
    
    var cards: [Cards] = [.init(name: "MercuryCard", view: AnyView(MercuryCard())),
                          .init(name: "VenusCard", view: AnyView(VenusCard())),
                          .init(name: "EarthCard", view: AnyView(EarthCard()))]
    
    var body: some View 
        NavigationView 
            ScrollView(.horizontal, showsIndicators: false) 
                HStack(spacing: 20) 
                    ForEach(cards, id: \.id)  cards in
                        NavigationLink(destination: cards.view) 
                            Text(cards.name)
                        
                    
                    .frame(width: 260, height: 400)
                
            
        
    


struct Cards: Identifiable 
    var id = UUID()
    var name: String
    var view: AnyView


struct MercuryCard: View 
    var body: some View 
        Text("MercuryCard")
    


struct VenusCard: View 
    var body: some View 
        Text("VenusCard")
    


struct EarthCard: View 
    var body: some View 
        Text("EarthCard")
    

【讨论】：

哦，这行得通！非常感谢您的帮助。我不知道 AnyView 是什么，但现在我知道了。再次感谢！