使用 isActive 的 List 中的 NavigationLink 推送错误的行

Question

I'm trying to use NavigationLink's isActive variable to pop back to the root view controller.

The problem I'm experiencing is that using isActive pushes the wrong row when clicking on a list item. Remove the isActive variable and everything works as expected.

Here's some example code for demonstration purposes:

struct ContentView: View {
    
    @State private var activateNavigationLink: Bool = false

    var exampleData = ["a", "b", "c"]
    
    var body: some View {
        
        NavigationView {
            
            List(exampleData, id: \.self) { item in
                
                NavigationLink(
                    destination: SecondView(item: item), isActive: $activateNavigationLink) {
                    
                    Text(item)
                }
            }
        }
    }
}

SecondView

struct SecondView: View {
    
    var item: String
    
    var body: some View {
        Text(item)
    }
}

This is driving me nuts. Any help would be greatly appreciated.

Answer 1

Because activateNavigationLink is just a Bool in your code, if it is true , every NavigationLink will register as active in your List . Right now, this is manifesting as the last item ( C ) getting pushed each time.

Instead, you'd need some system to store which item is active and then translate that to a boolean binding for the NavigationLink to use.

Here's one possible solution:

struct ContentView: View {
    
    @State private var activeNavigationLink: String? = nil

    var exampleData = ["a", "b", "c"]
    
    func bindingForItem(item: String) -> Binding<Bool> {
        .init {
            activeNavigationLink == item
        } set: { newValue in
            activeNavigationLink = newValue ? item : nil
        }
    }
    
    var body: some View {
        
        NavigationView {
            
            List(exampleData, id: \.self) { item in
                
                NavigationLink(
                    destination: SecondView(item: item), isActive: bindingForItem(item: item)) {
                    
                    Text(item)
                }
            }
        }
    }
}

Answer 2

You should not use activeNavigationLink on main view it should be used with cellView

struct ContentView: View {
        
    var exampleData = ["a", "b", "c"]
    
    var body: some View {
        
        NavigationView {
            
            List(exampleData, id: \.self) { item in
                
               CellView(item: item)
            }
        }
    }
}

CellView

struct CellView: View {
        
    @State private var activateNavigationLink: Bool = false
        var item: String
        
        var body: some View {
              NavigationLink(
                        destination: SecondView(item: item), isActive: $activateNavigationLink) {
                        
                        Text(item)
                    }
        }
    }

SecondView

struct SecondView: View {
    
    var item: String
    
    var body: some View {
        Text(item)
    }
}