列表中的 SwiftUI NavigationLink

SwiftUI NavigationLink in list

我试着做一个列表,里面有图像和导航 link。在 iOS 14.1 中,一切正常,但在我将 iOS 更新到 14.2 后,出现了问题。在列表中,当用户单击大图像时,将弹出一个动作 sheet,当用户单击系统图像时,将触发导航 link。但是,当我更新到 iOS 14.2 时,无论我点击什么,它都会触发 NavigationLink。谁能给我解释一下为什么会这样以及如何解决?

这里是示例代码

struct ContentView : View {
    
    @State var showingActionSheet = false
    @State private var action: Int? = 0
    
    var body: some View {
        NavigationView {
            List{
                VStack(alignment: .leading){
                    HStack{
                        VStack(alignment: .leading){
                            Text("my data")
                            Text("2020/12/12")
                        }
                    }
                    Image("profile")
                        .resizable()
                        .aspectRatio(contentMode: .fit)
                        .onTapGesture(count: 1) {
                            self.showingActionSheet.toggle()
                        }
                    HStack{
                        Image(systemName: "message")
                            .resizable()
                            .aspectRatio(contentMode: .fit)
                            .frame(width: 25)
                            .foregroundColor(.gray)
                            .onTapGesture {
                                self.action = 1
                                print("select comment")
                            }
                        
                        NavigationLink(destination: Text("test"), tag: 1, selection: $action) {
                            EmptyView()
                        }
                    }
                }
                .actionSheet(isPresented: $showingActionSheet) {
                    //action sheet
                    ActionSheet(title: Text("Test"), message: Text("Select a selection"), buttons: [
                        .default(Text("test")) { print("test") },
                        .cancel()
                    ])
                }
                
            }
        }
    }
}

您可以使用isActive触发导航link。

@State var isCommentPresented = false
...
Image(systemName: "message")
    .resizable()
    .aspectRatio(contentMode: .fit)
    .frame(width: 25)
    .foregroundColor(.gray)
    .onTapGesture {
        self.isCommentPresented = true
        print("select comment")
    }
}                        
NavigationLink(destination: Text("test"), isActive:self.$isCommentPresented) {
   EmptyView()
}

尝试以下操作(禁用导航 link 会阻止用户对其进行交互,但以编程方式激活它):

HStack{
    Image(systemName: "message")
        .resizable()
        .aspectRatio(contentMode: .fit)
        .frame(width: 25)
        .foregroundColor(.gray)
        .onTapGesture {
            self.action = 1
            print("select comment")
        }
    NavigationLink(destination: Text("test"), tag: 1, selection: $action) {
        EmptyView()
    }.disabled(true)      // << here !!
}

最重要的是使用 Zstack 可能是原因。 没有ZStack请检查一次