如何在Jetpack Compose Navigation中正确处理导航与回退栈逻辑？

我需要实现符合以下导航模式的功能：现有a、b、c、d四个页面，导航序列为a > b > d > c > b > d。当处于d页面时按下返回键，导航路径应为d > b > c > a > 退出应用。我尝试了如下实现，但运行结果不符合预期。

@Composable
fun BottomNavBar(navController: NavController, currentDestination: NavDestination?) {
    NavigationBar(modifier = Modifier.height(120.dp)) {
        topLevelRoutes.forEach { topLevelRoute ->
            NavigationBarItem(
                selected = currentDestination?.hierarchy?.any { it.hasRoute(topLevelRoute.route::class) } == true,
                onClick = {
                    if (!navController.popBackStack(topLevelRoute.route, false)) {
                        navController.navigate(topLevelRoute.route) {
                            // Avoid multiple copies of the same destination when
                            // reselecting the same item
                            launchSingleTop = true
                            // Restore state when reselecting a previously selected item
                            restoreState = true
                        }
                    }
                },
                icon = { Icon(topLevelRoute.icon, contentDescription = null) },
                label = { Text(topLevelRoute.name) })
        }
    }
}

当前代码的核心问题是破坏了返回栈的连续性：使用popBackStack(topLevelRoute.route, false)会尝试回退到已存在的顶层路由实例，而非添加新实例到栈中。比如从c页面点击底部导航的b时，会直接跳转到第一个b实例，导致c和第一个b之间的d被留在栈内，最终返回顺序和预期不符。

1. 调整底部导航点击逻辑 #

要保留完整的用户导航路径，点击底部导航的非当前选中路由时，直接添加新实例到返回栈，而非回退到已存在的实例：

@Composable
fun BottomNavBar(navController: NavController, currentDestination: NavDestination?) {
    NavigationBar(modifier = Modifier.height(120.dp)) {
        topLevelRoutes.forEach { topLevelRoute ->
            val isSelected = currentDestination?.hierarchy?.any { it.hasRoute(topLevelRoute.route::class) } == true
            NavigationBarItem(
                selected = isSelected,
                onClick = {
                    if (isSelected) {
                        // 已选中当前路由，不修改返回栈
                        return@NavigationBarItem
                    }
                    // 导航到目标路由，添加新实例到返回栈
                    navController.navigate(topLevelRoute.route) {
                        launchSingleTop = false // 允许同一路由的多个实例
                        restoreState = true // 恢复路由之前的状态
                    }
                },
                icon = { Icon(topLevelRoute.icon, contentDescription = null) },
                label = { Text(topLevelRoute.name) }
            )
        }
    }
}

2. 调整非顶层页面到顶层页面的导航逻辑 #

如果严格需要返回路径为d > b > c > a > 退出应用，在从c页面跳转到b页面时，需要清除中间的d实例：

// 在c页面中跳转至b的代码
navController.navigate(bRoute) {
    // 回退到第一个b实例，并清除两者之间的所有栈项（即d）
    popUpTo(bRoute) {
        inclusive = false
        saveState = true
    }
    launchSingleTop = true
}

调整后返回栈结构为[a, b, c, b, d]，按返回键的顺序为d → b → c → b → a → 退出。若要完全跳过第一个b，可将popUpTo的目标改为a，但会丢失第一个b的状态，需根据实际需求选择。

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