list - SwiftUI - 两个单独的按钮作为一个按钮

Question

Xcode 11.3 (11C29).  
macOS 10.15.2.

在下面的 SwiftUI 视图中，有两个按钮。一个打印“OK”，另一个打印“Cancel”。但是，无论按下哪个按钮，都会执行两个打印语句。 为什么会这样？（我认为它一定是一个 SwiftUI 错误。）

struct ContentView: View {

    var body: some View {
        List {
            HStack {
                Button("OK") {
                    print("OK.")
                }
                Button("Cancel") {
                    print("Cancel")
                }
            }
        }
    }    
}

（如果 theList或 theHStack被注释掉，那么每个按钮只打印自己的语句。）

Answer 1

您可以使用它.buttonStyle(BorderlessButtonStyle())来达到预期的效果。如果你想在你的内部有按钮List，它允许你单独点击以及List行。

这是一个带有ForEach(..)循环的实现：

struct ContentView: View {
    var body: some View {
        List {
            ForEach(["My List Item Buttons"], id: \.self) {
                item in
                HStack {
                    Text("\(item)")
                    Spacer()
                    Button(action: { print("\(item) 1")}) {
                        Text("OK")
                    }
                    Button(action: { print("\(item) 2")}) {
                        Text("Cancel")
                    }
                }
            }
            .buttonStyle(BorderlessButtonStyle())
        }
    }
}

为方便起见，List初始化程序还允许您像上面的ForEach视图一样使用它，以防您想要一个仅包含单个单元格类型的列表。

List(["My List Item Buttons"], id: \.self) { item in
    Text("Row \(row)")
}

或者像这样没有：

struct ContentView: View {
    var body: some View {
        List {
            HStack {
                Button(action: { print("OK")}) {
                    Text("OK")
                }
                Button(action: { print("Cancel")}) {
                    Text("Cancel")
                }
            }
            .buttonStyle(BorderlessButtonStyle())
        }
    }
}