SwiftUI:NavigationLink 在最小的 10 行示例中导致不需要的填充

Question

当在 NavigationLink 中包装 View 以创建主从流程时，NavigationLink 似乎添加了我不想要的填充(红色)。

如果我注释掉 NavigationLink，一切看起来都是正确的(右图)。然而，这当然让我的观点无法点击。

如何去除在 Watch 上渲染时出现的红色填充？

这是我运行的代码:

struct ContentView: View {
    
    let testArray = [1,2,3,4,5]
    
    var body: some View {
        
        ScrollView {
            VStack {
                ForEach(testArray, id: \.self) { element in
                    
                    NavigationLink(destination: Text("")) {
                        Text("BB . . . . . . . . . . . . . . . . . . . . . . .")
                            .font(.title3)
                            .foregroundColor(.white)
                            .background(Color.blue)
                    }.background(Color.red) //has all the unwanted padding
                    
                }
            }.background(Color.black)
        }.background(Color.gray)
    }
}

我在 How to show NavigationLink as a button in SwiftUI 找到了一些很好的提示然而，使用 ZStack/.background 技巧只会留下一个可点击的 ~30px strip ，在这种情况下它不会填满整个 ZStack。

我发现填充似乎是静态的 8px。所以我现在正在做的是 .padding(.all, -8) 希望能有更好的解决方案

Answer 1

将 .buttonStyle(PlainButtonStyle()) 应用于您的 NavigationLink 以移除填充和背景。显然，您还会丢失按钮的默认样式，因此如果需要，您必须重新创建它。