SwiftUI中点击TabBarItem时返回根视图控制器的实现方案求助

方案一：iOS 16+ 原生SwiftUI实现（推荐） #

如果项目仅需支持iOS16及以上版本，这种原生方式最适配SwiftUI开发模式。核心逻辑是给每个Tab的导航栈绑定独立的路径状态，监听Tab选中事件，当用户点击已选中的Tab时，清空对应Tab的导航路径，自动回到根视图。

代码示例 #

// 假设你的TabItem枚举定义如下
enum TabItem {
    case orange, service, timetable, more
}

struct ContentView: View {
    @State private var activeTab: TabItem = .orange
    // 为每个Tab单独维护导航路径
    @State private var orangeNavPath = NavigationPath()
    @State private var serviceNavPath = NavigationPath()
    @State private var timetableNavPath = NavigationPath()
    @State private var moreNavPath = NavigationPath()
    
    // 记录上一次选中的Tab，用于判断是否点击了当前Tab
    @State private var lastSelectedTab: TabItem = .orange
    
    var body: some View {
        TabView(selection: $activeTab) {
            NavigationStack(path: $orangeNavPath) {
                FirstTabView() // 你的第一个Tab根视图
            }
            .tabItem { TabViewTab(activeTab: $activeTab, tab: .orange) }
            .tag(TabItem.orange)
            
            NavigationStack(path: $serviceNavPath) {
                SecondTabView() // 第二个Tab根视图
            }
            .tabItem { TabViewTab(activeTab: $activeTab, tab: .service) }
            .tag(TabItem.service)
            
            NavigationStack(path: $timetableNavPath) {
                ThirdTabView() // 第三个Tab根视图
            }
            .tabItem { TabViewTab(activeTab: $activeTab, tab: .timetable) }
            .tag(TabItem.timetable)
            
            NavigationStack(path: $moreNavPath) {
                ForthTabView() // 第四个Tab根视图
            }
            .tabItem { TabViewTab(activeTab: $activeTab, tab: .more) }
            .tag(TabItem.more)
        }
        .onChange(of: activeTab) { newTab in
            if newTab == lastSelectedTab {
                // 点击了当前选中的Tab，清空对应导航路径
                switch newTab {
                case .orange:
                    orangeNavPath.removeLast(orangeNavPath.count)
                case .service:
                    serviceNavPath.removeLast(serviceNavPath.count)
                case .timetable:
                    timetableNavPath.removeLast(timetableNavPath.count)
                case .more:
                    moreNavPath.removeLast(moreNavPath.count)
                }
            }
            lastSelectedTab = newTab
        }
    }
}

方案二：兼容iOS 13+ 的UIKit桥接方案 #

如果需要支持iOS13及更早版本，可借助UIKit的UITabBarController代理实现。通过封装自定义TabView，捕捉Tab点击事件，判断点击的是当前选中的Tab时，遍历视图控制器栈执行popToRootViewController操作。

代码示例 #

import SwiftUI

struct CustomTabView: UIViewControllerRepresentable {
    typealias UIViewControllerType = UITabBarController
    
    let tabs: [(view: AnyView, tabItem: UITabBarItem)]
    
    func makeUIViewController(context: Context) -> UITabBarController {
        let tabBarController = UITabBarController()
        tabBarController.delegate = context.coordinator
        // 将每个SwiftUI视图转为UIHostingController
        tabBarController.viewControllers = tabs.map {
            UIHostingController(rootView: $0.view)
        }
        // 设置每个Tab的tabBarItem
        tabBarController.viewControllers?.enumerated().forEach { index, vc in
            vc.tabBarItem = tabs[index].tabItem
        }
        return tabBarController
    }
    
    func updateUIViewController(_ uiViewController: UITabBarController, context: Context) {}
    
    func makeCoordinator() -> Coordinator {
        Coordinator()
    }
    
    class Coordinator: NSObject, UITabBarControllerDelegate {
        func tabBarController(_ tabBarController: UITabBarController, shouldSelect viewController: UIViewController) -> Bool {
            // 判断是否点击了当前已选中的控制器
            guard let selectedIndex = tabBarController.selectedIndex,
                  let viewControllers = tabBarController.viewControllers,
                  viewController == viewControllers[selectedIndex] else {
                return true
            }
            
            // 递归查找导航控制器，执行popToRoot
            func popToRoot(_ vc: UIViewController) {
                if let nav = vc as? UINavigationController {
                    nav.popToRootViewController(animated: true)
                } else if let child = vc.children.first {
                    popToRoot(child)
                }
            }
            
            popToRoot(viewController)
            return true
        }
    }
}

// 使用示例
struct ContentView: View {
    var body: some View {
        CustomTabView(tabs: [
            (view: AnyView(FirstTabView()), 
             tabItem: UITabBarItem(title: "Orange", image: UIImage(systemName: "circle.fill"), tag: 0)),
            (view: AnyView(SecondTabView()), 
             tabItem: UITabBarItem(title: "Service", image: UIImage(systemName: "gear"), tag: 1)),
            (view: AnyView(ThirdTabView()), 
             tabItem: UITabBarItem(title: "Timetable", image: UIImage(systemName: "calendar"), tag: 2)),
            (view: AnyView(ForthTabView()), 
             tabItem: UITabBarItem(title: "More", image: UIImage(systemName: "ellipsis.circle"), tag: 3))
        ])
    }
}

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