SwiftUI-NavigationLink的目标创建带有额外空间的视图 [英] SwiftUI - destination of NavigationLink creates view with extra space

问题描述

我将登录页面缩小为一个NavigationLink，该导航链接将List视图作为其目的地.正如您在下图中所看到的，问题在于，我得到了如右图所示的巨大空间，而不是左侧的间距很好的标题.两种视图是相同的，但是右边的视图是页面的设计预览.左图是从登录屏幕进入后的页面预览.

I've whittled my login page down to a single NavigationLink that leads to a List view as its destination. The problem, as you can see in the image below, is that instead of the nicely spaced title on the left, I get the huge space as shown on the right. Both views are the same, but the one on the right is the preview of the page as it was designed. The image on the left is the preview of the page after coming from the login screen.

struct ContentView: View {
    
    var body: some View {
        NavigationView {
            NavigationLink(destination: CustomerView()) {
                Text("login")
            }
        }
    }
}

以下是列表"视图的代码:

Here is the code for the List view:

var body: some View {
        
        NavigationView {
            VStack {
                SearchBarView(text: $searchText)
                    .padding(.top, 0)
                List {
                    ForEach(customers.filter({searchText.isEmpty ? true : $0.name.localizedCaseInsensitiveContains(searchText)})) { customer in
                        NavigationLink(destination: CustomerDetailView(customer: customer)) {
                            CustomerRow(customer: customer)
                        }
                        .navigationBarTitle("Customers")
                    }
                }
            }
        }
        .navigationBarBackButtonHidden(true)
    }
}

推荐答案

您不需要两次 NavigationView . NavigationView 应该将顶级视图包装一次，并且将覆盖您浏览的所有视图.在 VStack

You don't need NavigationView twice. NavigationView should wrap top level view once and it will have over all views that you navigated. Remove NavigationView over VStack

 VStack {
    List {
        ForEach(0..<10) { index in
            NavigationLink(destination: Text("Hello \(index)")) {
                Text("\(index)")
            }
        }
    }
}
.navigationBarTitle("Customers")
.navigationBarBackButtonHidden(true)

这篇关于SwiftUI-NavigationLink的目标创建带有额外空间的视图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！