SwiftUI Panel视图编译失败：双可选视图自定义视图如何实现？

你的Panel视图无法编译的核心原因是：当省略header或footer参数时，Swift编译器无法推断对应的泛型类型（Header或Footer）——因为可选闭包为nil时，没有足够的上下文确定类型。

要解决这个问题，我们可以给泛型参数设置默认类型，并调整初始化逻辑，让未传入的可选视图自动使用EmptyView（一个不渲染任何内容的空视图），具体步骤如下：

1. 给Header和Footer泛型参数添加默认类型EmptyView
2. 将初始化方法中的可选闭包改为非可选，并设置默认返回EmptyView，避免类型推断失败
3. 移除实例属性的可选性，直接使用具体类型（空视图不影响布局）

修正后的完整代码：

import SwiftUI

struct Panel<Content: View, Header: View = EmptyView, Footer: View = EmptyView>: View {
    let content: Content
    let header: Header
    let footer: Footer
    
    init(
        @ViewBuilder header: () -> Header = { EmptyView() },
        @ViewBuilder footer: () -> Footer = { EmptyView() },
        @ViewBuilder content: () -> Content
    ) {
        self.header = header()
        self.footer = footer()
        self.content = content()
    }
    
    var body: some View {
        VStack(spacing: 0) {
            header
            content
            footer
        }
    }
}

@main
struct TestApp: App {
    var body: some Scene {
        WindowGroup {
            /// All views
            Panel(header: {
                Button("Header") {
                    print("Got it!")
                }
                HStack {
                    Text("Goodbye!!")
                    Text("World!")
                }
            }, footer: {
                Button("Footer") {
                    print("Got it!")
                }
                HStack {
                    Text("Goodbye!!")
                    Text("World!")
                }
            }) {
                VStack {
                    Text("Hello!")
                    Text("World!")
                }
            }

            /// No header
            Panel(footer: {
                Button("Footer") {
                    print("Got it!")
                }
                HStack {
                    Text("Goodbye!!")
                    Text("World!")
                }
            }) {
                VStack {
                    Text("Hello!")
                    Text("World!")
                }
            }

            /// No footer
            Panel(header: {
                Button("Header") {
                    print("Got it!")
                }
                HStack {
                    Text("Goodbye!!")
                    Text("World!")
                }
            }) {
                VStack {
                    Text("Hello!")
                    Text("World!")
                }
            }
            
            /// No header nor footer
            Panel() {
                VStack {
                    Text("Hello!")
                    Text("World!")
                }
            }
        }
    }
}

这样修改后，所有场景都能正常编译：

• 当不传入header或footer时，编译器会自动使用EmptyView作为对应泛型类型，空视图不会在界面上显示任何内容
• @ViewBuilder修饰符依然可以支持多视图的闭包语法
• 布局逻辑保持不变，VStack会自动忽略空视图的占位

内容的提问来源于stack exchange，提问作者Phantom59