SwiftUI如何从Menu按钮push到新视图 内置NavigationLink失效如何解决

错误原因 #

• 第一种直接把NavigationLink放在Menu内的写法：NavigationLink必须处于NavigationStack（iOS16+）或NavigationView（iOS15及更低版本）的直接视图层级中才能生效，Menu的下拉弹出内容属于独立层级，不在导航栈的普通视图树内，因此无法触发跳转。
• 第二种把NavigationLink写在Button的action闭包中的写法：NavigationLink是SwiftUI视图组件，不是可执行的逻辑方法，放在action闭包中没有任何实际作用。

解决方案 #

方案1：绑定NavigationPath触发跳转（适配iOS 16+） #

这是iOS16及以上版本的推荐实现，通过路由路径统一管理导航跳转：

1. 首先在视图中定义导航路径状态变量：

@State private var navPath = NavigationPath()

2. 将当前页面的根容器改为绑定路径的NavigationStack，并声明路由对应的目标视图：

NavigationStack(path: $navPath) {
    // 原有页面的所有内容
    .navigationDestination(for: String.self) { routeTag in
        if routeTag == "readMore" {
            ReadMoreView()
        }
        // 可扩展其他跳转路由的匹配逻辑
    }
}

3. 修改Menu代码，点击按钮时向路径中追加对应路由即可触发跳转：

ToolbarItem(placement: .navigationBarTrailing) {
    Menu {
        Button {
            navPath.append("readMore")
        } label: {
            Label("Read more", systemImage: "ellipses")
        }
    } label: {
        Text("Next")
    }
}

方案2：绑定Bool状态触发跳转（兼容iOS 13+） #

如果需要适配旧版本系统，可以通过状态控制隐藏的NavigationLink激活：

1. 首先定义跳转状态变量：

@State private var showReadMoreView = false

2. 在当前视图的普通层级（和Menu同层级即可，不要放在Menu内部）添加隐藏的NavigationLink：

NavigationLink(isActive: $showReadMoreView, destination: { ReadMoreView() }) {
    EmptyView()
}

3. 修改Menu代码，点击按钮时修改状态即可触发跳转：

ToolbarItem(placement: .navigationBarTrailing) {
    Menu {
        Button {
            showReadMoreView = true
        } label: {
            Label("Read more", systemImage: "ellipses")
        }
    } label: {
        Text("Next")
    }
}

注意：两种方案都要求当前页面处于NavigationStack或NavigationView的管理范围内，否则无法触发push跳转效果。

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