如何通过点击TabItem关闭所有NavigationLink视图并返回RoomListView？

当你在RoomListView内通过NavigationLink进入深层页面后，默认点击TabItem只会切换标签但不会重置导航栈。要实现点击对应TabItem回到RoomListView根视图，可通过以下步骤实现：

方法：绑定NavigationStack路径 + 监听Tab选中状态 #

1. 在ContentView中添加状态变量 #

在ContentView的视图结构体里定义导航路径和选中标签的状态：

@State private var roomNavPath = NavigationPath()
@State private var selectedTab = 0 // 假设Rooms标签是第0个标签页

2. 修改TabView与NavigationStack的绑定 #

将RoomListView包裹在NavigationStack中并绑定路径，同时给TabItem添加标签并监听选中变化：

TabView(selection: $selectedTab) {
    NavigationStack(path: $roomNavPath) {
        RoomListView(myRoom: $viewModel.rooms)
            .onAppear {
                viewModel.populateRoomList()
                viewModel.roomJoinRequestUpdate()
            }
            .tabItem { Label("Rooms", systemImage: "house.fill") }
            .tag(0)
        // 在这里添加navigationDestination，对应RoomListView里的导航目标
        // 示例：
        .navigationDestination(for: Room.self) { room in
            RoomDetailView(room: room)
        }
    }
    
    // 其他标签页...
}
.onChange(of: selectedTab) { oldValue, newValue in
    // 当重复点击Rooms标签时，重置导航路径
    if newValue == 0 && oldValue == 0 {
        roomNavPath = NavigationPath()
    }
}

3. 调整RoomListView内的NavigationLink #

在RoomListView中，使用基于value的NavigationLink（而非旧的destination方式），确保导航动作更新绑定的路径：

// RoomListView内的示例导航链接
ForEach(viewModel.rooms) { room in
    NavigationLink(room.name, value: room)
}

这样，当你在深层页面点击"Rooms" TabItem时，就会自动重置导航栈，回到RoomListView的根视图。

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