SwiftUI 4中NavigationSplitView视图切换行为异常问题咨询

问题现象 #

SwiftUI 4 新增NavigationSplitView组件，实测存在以下表现差异：

• 侧边栏菜单点击逻辑中，若详情构造函数返回纯Text视图，点击菜单项可正常切换对应详情内容，行为符合预期
• 将分支返回值替换为AnyView包裹的不同视图时，即使给构造函数添加@ViewBuilder标注，点击菜单项也无法触发详情视图更新

测试代码如下：

struct MainScreen: View {
    
    @State private var menuItems = MenuItem.menuItems
    @State private var menuItemSelection: MenuItem?
    
    var body: some View {
        NavigationSplitView {
            List(menuItems, selection: $menuItemSelection) { course in
                Text(course.name).tag(course)
            }
            .navigationTitle("HappyFreelancer")
        } detail: {
            content(menuItemSelection)
        }
        .navigationSplitViewStyle(.balanced)
    }
    
    func content(_ selection: MenuItem?) -> some View {
        switch selection {
            case .editProfile:
                return Text("Edit Profile")
            case .evaluateProfile:
                return Text("Evaluate Profile")
            case .setupApplication:
                return Text("Setup Application")
            case .none:
                return Text("none")

//          case .editProfile:
//              return AnyView(EditProfileScreen())
//          case .evaluateProfile:
//              return AnyView(Text("Evaluate Profile"))
//          case .setupApplication:
//              return AnyView(Text("Setup Application"))
//          case .none:
//              return AnyView(Text("none"))
        }
    }
}

struct MainScreen_Previews: PreviewProvider {
    static var previews: some View {
        MainScreen()
    }
}

enum MenuItem: Int, Identifiable, Hashable, CaseIterable {
    var id: Int { rawValue }
    case editProfile
    case .evaluateProfile
    case .setupApplication

    var name: String {
        switch self {
            case .editProfile: return "Edit Profile"
            case .evaluateProfile: return "Evaluate Profile"
            case .setupApplication: return "Setup Application"
        }
    }
}

extension MenuItem {
    static var menuItems: [MenuItem] {
        MenuItem.allCases
    }
}

struct EditProfileScreen: View {
    var body: some View {
        Text("Edit Profile")
    }
}

根本原因 #

这不是系统bug，是代码实现不符合SwiftUI的视图更新规则：

1. 未标注@ViewBuilder的普通函数声明返回some View时，Swift要求所有逻辑分支返回的具体视图类型完全一致。前四个分支全部返回Text类型，类型完全统一，Swift可以正常推断具体类型，selection变化时SwiftUI能识别到视图值的变更，触发正常刷新。
2. 切换为AnyView返回分支后，即使表面上所有分支返回的都是AnyView类型，手动return的写法配合非Builder的函数逻辑，会导致SwiftUI无法追踪AnyView内部包裹的视图变化；加上NavigationSplitView的详情区域会依赖视图的稳定身份判断是否需要刷新，没有显式标识变化的情况下，系统会判定详情区域内容无变化，不触发更新。
3. 仅给函数加@ViewBuilder但保留分支前的return关键字也无效：@ViewBuilder作为结果构造器，会按照闭包内的视图声明逻辑构造组合类型，手动写return会绕过Builder的处理逻辑，直接返回单值，类型追踪机制仍然失效。

修复方案 #

• 优先方案：给content函数添加@ViewBuilder标注，删除所有分支前的return关键字，完全不需要手动用AnyView做类型抹除，让系统自动处理多分支视图的类型组合，这是SwiftUI多分支视图的标准写法：

@ViewBuilder
func content(_ selection: MenuItem?) -> some View {
    switch selection {
    case .editProfile:
        EditProfileScreen()
    case .evaluateProfile:
        Text("Evaluate Profile")
    case .setupApplication:
        Text("Setup Application")
    case .none:
        Text("none")
    }
}

• 临时兼容方案：如果必须使用AnyView做类型抹除（不推荐，会破坏SwiftUI的视图差分性能），给详情区域的根视图添加.id(selection)修饰符，强制SwiftUI在选中项变化时识别到视图身份变更，触发刷新：

func content(_ selection: MenuItem?) -> some View {
    Group {
        switch selection {
        case .editProfile:
            AnyView(EditProfileScreen())
        case .evaluateProfile:
            AnyView(Text("Evaluate Profile"))
        case .setupApplication:
            AnyView(Text("Setup Application"))
        case .none:
            AnyView(Text("none"))
        }
    }
    .id(selection)
}

注意：日常开发中尽量避免随意使用AnyView，它不仅会带来额外的性能开销，还容易引发视图身份识别异常，多分支场景优先使用@ViewBuilder实现。

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