点击列表行中的任何地方都会触发导航链接，有什么方法可以改变这种行为吗？

如何解决点击列表行中的任何地方都会触发导航链接，有什么方法可以改变这种行为吗？

我正在使用 iOS 14 中的 Scrollview + Lazyvstack 和 iOS 13 中的 List 创建一个列表，但点击行为是不同的。如果我将 NavigationLink 放在 Lazyvstack 中，则链接仅在点击时触发，但在 List 中，如果我点击行中的任何地方，NavigationLink 将被触发。

有没有办法仅在点击列表时触发列表中的某些 NavigationLink？下面这段代码是一个例子，真正的项目在组件内部有很多组件，不是简单地把导航链接放在列表之外。

代码：

列表画面

import SwiftUI

struct ContentView: View {
    
    @State var navigate = false
    
    var body: some View {
        NavigationView {
            vstack {
                VList {
                    ForEach(0..<3) { index in
                        vstack(alignment: .leading) {
                            HStack {
                                Text("Item title")
                                    .font(.system(size: 17))
                                    .fontWeight(.semibold)
                                    .frame(idealWidth: .infinity,maxWidth: .infinity,alignment: .leading)
                                    .padding(.all,4)
                                
                                ZStack {
                                    Text("See more")
                                        .font(.system(size: 15))
                                        .underline()
                                        .padding(.all,4)
                                        .onTapGesture {
                                            self.navigate = true
                                        }
                                    
                                    NavigationLink(
                                        destination: Text("Destination"),isActive: $navigate,label: {
                                            EmptyView()
                                        })
                                        .buttonStyle(PlainButtonStyle())
                                }
                            }
                            
                            Text("Description of item")
                        }
                    }
                }
            }
            .navigationBarHidden(true)
            .navigationBarTitle("")
        }
    }
}

VList 组件

import SwiftUI

struct VList<Content:View>: View {
    
    var content: () -> Content
    
    var body: some View {
        if #available(iOS 14.0,*) {
            ScrollView {
                Lazyvstack(spacing: 0) {
                    content()
                }
            }
        } else {
            List {
                content()
                    .padding(.horizontal,-20)
            }
            .onAppear {
                UITableView.appearance().separatorStyle = .none
                UITableViewCell.appearance().selectionStyle = .none
            }
        }
    }
}

解决方法

您必须了解 VStack 并使用 onTapGesture。所以我不知道你的应用程序是什么颜色或背景我给了隐形颜色，你可以用你的颜色替换它。另请注意，您应该告诉 SwiftUI 背景正在使用中，这使得 SwiftUI 不会将操作应用于所有 VStack。

---

struct ContentView: View {
    
    @State var navigate = false
    
    var body: some View {
        NavigationView {
            VStack {
                List {
                    ForEach(0..<3) { index in
                        VStack(alignment: .leading) {
                            HStack {
                                Text("Item title")
                                    .font(.system(size: 17))
                                    .fontWeight(.semibold)
                                    .frame(idealWidth: .infinity,maxWidth: .infinity,alignment: .leading)
                                    .padding(.all,4)
                                
                                ZStack {
                                    Text("See more")
                                        .font(.system(size: 15))
                                        .underline()
                                        .padding(.all,4)
                                        .onTapGesture {
                                            self.navigate = true
                                        }
                                    
                                    NavigationLink(
                                        destination: Text("Destination"),isActive: $navigate,label: {
                                            EmptyView()
                                        })
                                        .buttonStyle(PlainButtonStyle())
                                }
                            }
                            
                            
                            Text("Description of item")
                        }
                        .background(Color.white.opacity(0.01).onTapGesture { })    // << : Here
                    }
                }
            }
            .navigationBarHidden(true)
            .navigationBarTitle("")
        }
    }
}