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

html5 • • 问答 • 132 阅读

我正在尝试在 SwiftUI 中的列表或 ForEach 循环中执行 NavigationLink。不幸的是，我得到了一个非常奇怪的行为（例如，当点击 Leo 时它会打开 Karl，Opening Max 也指向 Karl）。

我已经发现它与 NavigationLink 中的“isActive”属性有关。不幸的是，我需要它在此处实现此行为：https : //i.stack.imgur.com/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()
        }
    }
    
}

谢谢！

回答

这是因为只使用了一种状态 navigationViewIsActive

因此，当您单击导航链接时，该值将更改为True，并且所有链接都将变为active

这种情况的解决方案是这样的：

  • 定义一个新的State，将保存选定的模型值
  • 你只需要一个NavigationLink，并制作它Hidden（把它放在 a 中VStack）
  • 在List使用中Button代替NavigationLink
  • 当一个Button点：首先更改selectedModel值，不是让navigationLink活动状态（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：我写了这个：如何使用SwiftUI导航，它将帮助您了解在swiftUI中导航的方法

  • Awesome thank you, now I got it. And thanks for the article!
以上是SwiftUI-List/ForEach与NavigationLink和isActive结合使用无法正常工作的全部内容。
THE END
分享
二维码
< <上一篇
下一篇>>