Swift中如何在Navigation Split View加载完成后自动选中Home项

要实现数据加载完成后自动选中"Home"并显示Summary视图，只需在原代码中添加状态监听逻辑，具体修改如下：

步骤1：添加加载完成状态判断 #

在ContentView结构体中添加一个计算属性，统一判断所有ViewModel的数据加载状态：

private var isAllDataLoaded: Bool {
    !vooVM.isloading && !vfiaxVM.isloading && !prinVM.isloading
}

步骤2：添加状态监听，自动设置选中项 #

在列表视图上添加onChange修饰器，监听加载完成状态，当所有数据加载完成且当前无选中项时，自动将selection设置为"Home"：

.navigationSplitViewColumnWidth(250)
// 新增状态监听逻辑
.onChange(of: isAllDataLoaded) { newState in
    if newState && selection == nil {
        selection = "Home"
    }
}

步骤3：（可选）优化详情视图兜底逻辑 #

为避免极端情况（如选中项被意外清空），修改详情视图的else分支，默认显示Summary视图：

} else {
    // 替换原提示文本，兜底显示Summary
    Summary(vooVM: vooVM, vfiaxVM: vfiaxVM, prinVM: prinVM)
        .navigationSplitViewColumnWidth(950)
}

修改后的完整代码 #

struct ContentView: View {
    @State private var selection: String?
    @ObservedObject private var vooVM: VOOViewModel
    @ObservedObject private var vfiaxVM: VFIAXViewModel
    @ObservedObject private var prinVM: PrincipalViewModel
    
    init(vooVM: VOOViewModel, vfiaxVM: VFIAXViewModel, prinVM: PrincipalViewModel) {
        self.vooVM = vooVM
        self.vfiaxVM = vfiaxVM
        self.prinVM = prinVM
    }
    
    // 新增：统一判断所有数据是否加载完成
    private var isAllDataLoaded: Bool {
        !vooVM.isloading && !vfiaxVM.isloading && !prinVM.isloading
    }
    
    let myList = ["Home", "VOO Chart", "VOO List", "VFIAX Chart", "VFIAX List", "Principal Chart", "Principal List"]
    
    var body: some View {
        NavigationSplitView {
            List(myList, id: \.self, selection: $selection) { listItem in
                NavigationLink(value: listItem) {
                    Text(listItem)
                }
            }
            .navigationSplitViewColumnWidth(250)
            // 新增：监听加载状态，自动选中Home
            .onChange(of: isAllDataLoaded) { newState in
                if newState && selection == nil {
                    selection = "Home"
                }
            }
        } detail: {
            if vooVM.isloading == true || vfiaxVM.isloading == true || prinVM.isloading == true {
                Spacer()
                ProgressView()
                    .navigationSplitViewColumnWidth(950)
                Spacer()
            } else if selection == "Home" {
                Summary(vooVM: vooVM, vfiaxVM: vfiaxVM, prinVM: prinVM)
                    .navigationSplitViewColumnWidth(950)
            } else if selection == "VOO Chart" {
                LineChart(passedInArray: vooVM.values1)
                    .navigationSplitViewColumnWidth(950)
            } else {
                // 优化：兜底显示Summary视图
                Summary(vooVM: vooVM, vfiaxVM: vfiaxVM, prinVM: prinVM)
                    .navigationSplitViewColumnWidth(950)
            }
            Spacer()
        }
        .frame(width: 1200,height: 900, alignment: .center)
    }
}

说明 #

• isAllDataLoaded属性简化了多ViewModel的加载状态判断，避免重复代码
• onChange逻辑确保仅在首次加载完成且无用户选择时自动选中"Home"，不会干扰用户后续操作
• 兜底逻辑提升了页面稳定性，避免出现空详情页的情况

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