Swift UI Application Navigation Link is disable

I am trying to move to details view when user click the cell but I do not know why it disable and not able to move into details view when I click the particular cell form UI view ..

Here is my code for content view ..

struct ContentView: View {
    @EnvironmentObject private var viewModel: FruitListViewModel

    var body: some View {
        VStack {
            Text("Fruit List ")
                .font(.largeTitle)
            List {
                ForEach(viewModel.fruits) { fruit in
                    
                    NavigationLink(destination: FruitDetailsView(fruit: fruit)) {
                        RowView(name: fruit.name, genus: fruit.genus, family: fruit.family)
                    }
                }
            }
        }
        .onAppear {

            viewModel.fetchFruit()
        }

    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

Here is the code for RowView ..

import SwiftUI

struct RowView: View {

    let name: String
    let genus: String
    let family: String

    var body: some View {

        VStack(alignment: .leading) {
            HeadTitleView(name: name)
            Text("Genus: \(genus)")
            Text("family:\(family)")
            Spacer()
        }
    }
}
struct RowView_Previews: PreviewProvider {
    static var previews: some View {
        RowView(name: "Apple", genus: "Apple", family: "Appicote")
    }
}

Here is the code for Details view ..

import SwiftUI

struct FruitDetailsView: View {
    @Environment(\.presentationMode) var presentationMode: Binding<PresentationMode>
    @State private var name: String = ""
    @State private var genus: String = ""
    @State private var family: String = ""

    let fruit: Fruits

    var body: some View {

        VStack(alignment: .center, spacing: 5) {
                Text("Name: \(fruit.name)")
                    .foregroundColor(Color.gray)
                Text("Genus: \(fruit.genus)")
                    .foregroundColor(Color.gray)

                Text("Family: \(fruit.family)")
                .foregroundColor(Color.gray).padding(50)

        }.onAppear(perform: {
            name = fruit.name
            genus = fruit.genus
            family = fruit.family
        }).padding(20)
    }
}

Here is the screenshot ..
enter image description here

>Solution :

NavigationLinks only work when they are in a NavigationView. Simply wrap your VStack in a NavigationView and this should work nicely.

Leave a Reply