SwiftUI 原生菜单栏点击无法跳转到设置页面问题求助

问题根因 #

你的写法存在点击组件逻辑冲突：NavigationLink 被嵌套在了 Button 的 label 参数中，点击操作会优先被外层的 Button 捕获响应，仅执行打印和变量赋值逻辑，无法触发 NavigationLink 自带的跳转行为。

修复方案 #

有两种常用修复方式，更推荐第二种编程式跳转，逻辑更清晰也更易维护：

方案1：移除外层Button，直接把NavigationLink作为Menu子项 #

直接删除包裹Settings跳转项的Button，NavigationLink本身就支持点击交互、可以直接放在Menu的内容里：

struct ContentView: View {
  
  @StateObject var vm = LoginViewModel()
  @State var selection: Int? = 0
  
  var body: some View {
    NavigationView {
      ZStack {
        if !vm.log_status {
          Home()
            .toolbar{
              ToolbarItem(placement: .navigationBarTrailing) {
                Menu {
                  Button {
                    print("at home")
                  } label: {
                    Label("Home", systemImage: "house.fill")
                  }
                  // 直接用NavigationLink替代Button
                  NavigationLink(destination: Text("Settings Page"), tag:1, selection: $selection) { 
                    Label("Settings", systemImage: "gearshape.fill")
                  }
                } label: {
                  Label(title: { Text("Menu")}, icon: {Image(systemName: "filemenu.and.selection").foregroundColor(Color.black).font(.system(size: 24))})
                }
              }
            }
        } else {
          Login()
        }
      }
      .navigationTitle("App")
    }
  }
}

方案2：纯编程式跳转（更推荐） #

把NavigationLink放在Menu外部的视图层级，仅在Menu的Button里修改selection的值触发跳转：

struct ContentView: View {
  
  @StateObject var vm = LoginViewModel()
  @State var selection: Int? = 0
  
  var body: some View {
    NavigationView {
      ZStack {
        if !vm.log_status {
          Home()
            .toolbar{
              ToolbarItem(placement: .navigationBarTrailing) {
                Menu {
                  Button {
                    print("at home")
                  } label: {
                    Label("Home", systemImage: "house.fill")
                  }
                  Button {
                    print("at setting")
                    self.selection = 1
                  } label: {
                    Label("Settings", systemImage: "gearshape.fill")
                  }
                } label: {
                  Label(title: { Text("Menu")}, icon: {Image(systemName: "filemenu.and.selection").foregroundColor(Color.black).font(.system(size: 24))})
                }
              }
            }
          // 把NavigationLink放在同级，隐藏显示仅用来响应selection变化
          NavigationLink(destination: Text("Settings Page"), tag:1, selection: $selection) {
            EmptyView()
          }
          .hidden()
        } else {
          Login()
        }
      }
      .navigationTitle("App")
    }
  }
}

补充注意项 #

如果你的项目最低兼容iOS 16及以上版本，更建议用NavigationStack替代已经废弃的NavigationView，新的路由API对编程式跳转的支持更稳定。

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