list - SwiftUI - List/ForEach 与 NavigationLink 和 isActive 结合使用无法正常工作

Question

我正在尝试在 SwiftUI 中的列表或 ForEach 循环中执行 NavigationLink。不幸的是，我得到了一个非常奇怪的行为(例如，当点击 Leo 时它会打开 Karl，Opening Max 也指向 Karl)。
我已经发现它与 NavigationLink 中的“isActive”属性有关。不幸的是，我需要它来实现这里的行为:/image/g0BFz.gif这也在这里问 SwiftUI - Nested NavigationView: Go back to root .
我还尝试使用选择和标签属性，但我无法实现“返回根目录”机制。
这是示例:

import SwiftUI


struct Model: Equatable, Hashable {
    var userId: String
    var firstName: String
    var lastName: String
}


struct ContentView: View {
    
    @State var navigationViewIsActive: Bool = false
    
    var myModelArray: [Model] = [
        Model(userId: "27e880a9-54c5-4da1-afff-05b4584b1d2f", firstName: "Leo", lastName: "Test"),
        Model(userId: "1050412a-cb12-4160-b7e4-2702ab8430c3", firstName: "Max", lastName: "Test"),
        Model(userId: "1050412a-cb12-4160-b7e4-2702ab8430c3", firstName: "Karl", lastName: "Test")]
    
    var body: some View {
        NavigationView {
            List(myModelArray, id: \.self) { model in
                NavigationLink(destination: secondView(firstName: model.firstName), isActive: $navigationViewIsActive){ Text(model.firstName) }
            }
            .listStyle(PlainListStyle())
        }
    }
}

struct secondView: View {
    
    @State var firstName: String
    
    var body: some View {
        NavigationView {
            Text(firstName)
                .padding()
        }
    }
    
}

谢谢!

Answer 1

这是因为只使用了一种状态 navigationViewIsActive因此，当您单击导航链接时，该值将更改为 True ，所有链接都是 active这种情况的解决方案是这样的:

定义一个新的 State它将保存选定的模型值

您只需要一个 NavigationLink ，并制作 Hidden (把它放在 VStack 中)

在 List使用 Button而不是 NavigationLink

当Button点击:先改selectedModel value ，而不是使导航链接处于事件状态(true)

像下面的代码( Tested with IOS 14 ):

import SwiftUI


struct Model: Equatable, Hashable {
    var userId: String
    var firstName: String
    var lastName: String
}


struct ContentView: View {
    
    @State var navigationViewIsActive: Bool = false
    @State var selectedModel : Model? = nil
    
    var myModelArray: [Model] = [
        Model(userId: "27e880a9-54c5-4da1-afff-05b4584b1d2f", firstName: "Leo", lastName: "Test"),
        Model(userId: "1050412a-cb12-4160-b7e4-2702ab8430c3", firstName: "Max", lastName: "Test"),
        Model(userId: "1050412a-cb12-4160-b7e4-2702ab8430c3", firstName: "Karl", lastName: "Test")]
    
    var body: some View {
        NavigationView {
            VStack {
                VStack {
                    if selectedModel != nil {
                        NavigationLink(destination: SecondView(firstName: selectedModel!.firstName), isActive: $navigationViewIsActive){ EmptyView() }
                    }
                }.hidden()
                
                List(myModelArray, id: \.self) { model in
                    Button(action: {
                        self.selectedModel = model
                        self.navigationViewIsActive = true
                    }, label: {
                        Text(model.firstName)
                    })
                }
                .listStyle(PlainListStyle())
            }
            
            
        }
    }
}

struct SecondView: View {
    
    @State var firstName: String
    
    var body: some View {
        NavigationView {
            Text(firstName)
                .padding()
        }
    }
    
}

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

PS:我是这样写的: How to navigate with SwiftUI ，它将帮助您了解在 swiftUI 中的导航方式