在 TextField 更改后 NavigationLink 关闭

Question

我的导航堆栈没有按预期工作。

从我的主视图中，我想切换到一个列表视图，为了这个示例，它代表一个字符串数组。 然后我想导航到一个详细视图，我希望能够在其中更改所选字符串的值。

我对以下代码有 2 个问题：

1. 在 TextField 中的第一次击键时，详细视图将被关闭
2. 值本身没有改变

另外，我想必须有一种更方便的方法来在详细视图中进行绑定...

代码如下：

import SwiftUI

@main
struct TestApp: App {
    var body: some Scene {
        WindowGroup {
            TestMainView()
        }
    }
}

struct TestMainView: View {
    var body: some View {
        NavigationView {
            List {
                NavigationLink("List View", destination: TestListView())
            }
            .navigationTitle("Test App")
        }
    }
}

struct TestListView: View {
    @State var strings = [
        "Foo",
        "Bar",
        "Buzz"
    ]
    
    @State var selectedString: String? = nil
    
    var body: some View {
        List(strings.indices) { index in
            NavigationLink(
                destination: TestDetailView(selectedString: $selectedString),
                tag: strings[index],
                selection: $selectedString) {
                Text(strings[index])
            }
            .navigationBarTitleDisplayMode(.inline)
            .navigationTitle("List")
        }
    }
}

struct TestDetailView: View {
    @Binding var selectedString: String?
    
    var body: some View {
        VStack {
            if let _ = selectedString {
                TextField("Placeholder",
                          text: Binding<String>( //what's a better solution here?
                            get: { selectedString! },
                            set: { selectedString = $0 }
                          )
                )
                .padding()
                .textFieldStyle(RoundedBorderTextFieldStyle())
            }
            Spacer()
        }
        .navigationTitle("Detail")
    }
}

struct TestMainView_Previews: PreviewProvider {
    static var previews: some View {
        TestMainView()
    }
}

我显然做错了，但我不知道该怎么做......

Answer 1

您正在从 NavigationLink 内部更改 NavigationLink 的 selection，这会强制 TestListView 重新加载。

您可以尝试以下方法：

struct TestListView: View {
    @State var strings = [
        "Foo",
        "Bar",
        "Buzz",
    ]

    var body: some View {
        List(strings.indices) { index in
            NavigationLink(destination: TestDetailView(selectedString: self.$strings[index])) {
                Text(self.strings[index])
            }
        }
    }
}

struct TestDetailView: View {
    @Binding var selectedString: String // remove optional

    var body: some View {
        VStack {
            TextField("Placeholder", text: $selectedString)
                .padding()
                .textFieldStyle(RoundedBorderTextFieldStyle())
            Spacer()
        }
    }
}