How do i open a different view depending on what navigation link was selected

[tayamirai]

Depending on the choices that gets selected, how do i open PremierLeagueView if Premier league navigation link gets selected?

[Chris_Parker]

In your PremierLeagueView you need to define a property to accept a league passed to it.

var league: League

Then in your ClubView instead of where you have

leagueNav.navigateLeague(LeagueName: league)

change that to

PremierLeagueView(league: league)

It would be useful if you supplied some additional code to show what you are doing in PremierLeagueView. Rather than posting code as a screenshot, copy and paste your code directly in your reply. Format that block of code by selecting it and then tap on the </> button at the top of the editing window. This formats the code block and anyone helping you can copy the code to do some testing and provide a solution much easier. Posting images means that the code has to be retyped and people here are less likely to assist.

[tayamirai]

I think i said it wrong Chris. If i do what you said, only the PremierLeagueView will pop up, but what if the league was BundesLiga? That should open the BundesLigaView

[Chris_Parker]

Given that you have many Leagues in the array, your View to display details of a selected league should be such that it can display any league passed to it. For that reason your LeagueDetailView code should be written such that is can be passed any league and still show the details for that league. There is no need to have a View for each league. That’s inefficient.

Consider the following code which is based on what you appear to be trying to achieve.

ClubView:

struct ClubView: View {
    @State private var leagues = [League]()

    var body: some View {
        NavigationStack {
            ScrollView {
                VStack {
                    ForEach(leagues) { league in
                        NavigationLink {
                            LeagueDetailView(league: league)
                        } label: {
                            LeagueCard(league: league)
                        }
                    }
                    .padding()
                }
            }
            .navigationTitle("League List")
            .onAppear {
                leagues = League.getData()
            }
        }
    }
}

LeagueDetailView:

struct LeagueDetailView: View {
    var league: League
    var body: some View {
        VStack(alignment: .leading) {
            Image(league.flag)
                .resizable()
                .frame(height: 200)
                .aspectRatio(contentMode: .fit)
                .border(Color.black, width: 1)

            Text(league.leagueName)
                .font(.system(size: 30, weight: .bold))

            Spacer()
        }
        .padding()
    }
}

#Preview {
    LeagueDetailView(league: League(flag: "England", leagueName: "Premier League"))
}

LeagueCard:

struct LeagueCard: View {
    var league: League
    var body: some View {
        ZStack {
            Image(league.flag)
                .resizable()
                .frame(height: 240)
                .aspectRatio(contentMode: .fit)

            Text(league.leagueName)
                .font(.system(size: 25, weight: .bold))
                .foregroundColor(.white)
                .padding(5)
                .background {
                    Color.gray.opacity(0.5)
                }
                .clipShape(RoundedRectangle(cornerRadius: 5))

        }
        .clipShape(RoundedRectangle(cornerRadius: 10))
        .overlay (
            RoundedRectangle(cornerRadius: 10)
                .stroke(Color.black, lineWidth: 1)
        )
    }
}

#Preview {
    LeagueCard(league: League(flag: "England", leagueName: "Premier League"))
}