SwiftUI中为自定义按钮视图添加Action的问题求助

你代码里的错误出在NavigationLink(destination: action)这一行：NavigationLink的destination参数要求传入一个View类型（即你要导航到的页面），但你传了一个()->Void类型的闭包（也就是action），所以编译器报错“Type 'Void' cannot conform to 'View'”。

另外你同时嵌套了NavigationLink和Button，这会导致交互逻辑混乱，因为两者都具备点击响应能力，没必要这么做。根据你的需求，给你三种修正方案：

方案一：仅实现导航功能 #

如果这个按钮的作用是跳转到指定页面，不需要额外自定义操作，调整函数参数，直接传入目标视图：

func TopButton<Destination: View>(symbolName: String, bgColor: String, destination: Destination) -> some View {
    NavigationLink(destination: destination) {
        Image(systemName: symbolName)
            .foregroundColor(.white)
            .font(.system(size: 24))
            .background(Color(hex: bgColor))
    }
}

使用示例：

// 假设HomeView是你要跳转的页面
TopButton(symbolName: "house.fill", bgColor: "FF5733", destination: HomeView())

方案二：仅实现自定义Action #

如果按钮不需要导航，只是执行自定义逻辑（比如打印、弹窗、数据处理），直接去掉NavigationLink，保留Button即可：

func TopButton(symbolName: String, bgColor: String, action: @escaping () -> Void) -> some View {
    Button(action: action) {
        Image(systemName: symbolName)
            .foregroundColor(.white)
            .font(.system(size: 24))
            .background(Color(hex: bgColor))
    }
}

使用示例：

TopButton(symbolName: "plus.circle.fill", bgColor: "33FF57") {
    print("按钮被点击")
    // 在这里添加你的自定义逻辑
}

方案三：同时实现导航和自定义Action #

如果需要点击按钮时既执行自定义逻辑，又跳转到目标页面，可以给NavigationLink添加onTapGesture来触发action：

func TopButton<Destination: View>(symbolName: String, bgColor: String, destination: Destination, action: @escaping () -> Void) -> some View {
    NavigationLink(destination: destination) {
        Image(systemName: symbolName)
            .foregroundColor(.white)
            .font(.system(size: 24))
            .background(Color(hex: bgColor))
    }
    .onTapGesture {
        action()
    }
}

使用示例：

TopButton(symbolName: "arrow.right.circle.fill", bgColor: "3357FF", destination: DetailView()) {
    print("即将跳转到详情页")
}

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