如何使用 Jetpack Compose Navigation 处理弹出多个屏幕

Question

我会尝试做一些 ASCII 艺术来描述这个问题：

       <--------------------------------------\
DestinationA --> DestinationC ---------> DestinationE
DestinationB ------/    \-----> DestinationD --/

我希望这是可以理解的。 C 可以从目的地 A 和 B 到达。E 可以从 C 和 D 到达。E 返回到 A 或 B（无论哪个在后堆栈中）。目的地 C、D 和 E 接受一个参数 (id)。

实现这一点的最佳方法是什么？使用嵌套导航图似乎是可能的。

以下内容有效，但感觉更像是一种变通方法，而不是导航组件的预期工作方式。

val destination = navController.getBackStackEntry("DestinationC/{id}").destination
navController.popBackStack(destination.id, true)

目前使用NavHost是：

val navController = rememberNavController()
NavHost(navController = navController, startDestination = "DestinationA") {
    compose("DestinationA") {
        ScreenA(hiltNavGraphViewModel(it))
    }
    compose("DestinationB") {
        ScreenB(hiltNavGraphViewModel(it))
    }
    compose("DestinationC/{id}", arguments = listOf(navArgument("id") { type = NavType.StringType })) {
        val viewModel = hiltNavGraphViewModel(it)
        val id = it.arguments?.getString("id")
        viewModel.setId(id)
        ScreenC(viewModel)
    }
    compose("DestinationD/{id}", arguments = listOf(navArgument("id") { type = NavType.StringType })) {
        val viewModel = hiltNavGraphViewModel(it)
        val id = it.arguments?.getString("id")
        viewModel.setId(id)
        ScreenD(viewModel)
    }
    compose("DestinationE/{id}", arguments = listOf(navArgument("id") { type = NavType.StringType })) {
        val viewModel = hiltNavGraphViewModel(it)
        val id = it.arguments?.getString("id")
        viewModel.setId(id)
        ScreenE(viewModel)
    }
}

Answer 1

@rofie-sagara 的回答对我不起作用。有一个支持路线的导航扩展。我认为嵌套导航是一个不相关的话题。文档并没有真正解释为什么嵌套导航实际上很有用。我从 E 移回 A 或 B 的最终解决方案是：

navigation.popBackStack(route = "DestinationC/{id}", inclusive = true)

Answer 2

使用嵌套导航图在差异导航上制作 DestinationC 和 DestinationE。

val navController = rememberNavController()
NavHost(navController = navController, startDestination = "DestinationA") {
    compose("DestinationA") {
        ScreenA(hiltNavGraphViewModel(it))
    }
    compose("DestinationB") {
        ScreenB(hiltNavGraphViewModel(it))
    }
    navigation("DestinationC".plus("/{id}"), "DestinationC".plus("_Route")) {
      compose("DestinationC/{id}", arguments = listOf(navArgument("id") { type = NavType.StringType })) {
          val viewModel = hiltNavGraphViewModel(it)
          val id = it.arguments?.getString("id")
          viewModel.setId(id)
          ScreenC(ViewModel)
      }
    }
    compose("DestinationD/{id}", arguments = listOf(navArgument("id") { type = NavType.StringType })) {
        val viewModel = hiltNavGraphViewModel(it)
        val id = it.arguments?.getString("id")
        viewModel.setId(id)
        ScreenD(viewModel)
    }
    navigation("DestinationE".plus("/{id}"), "DestinationE".plus("_Route")) {
      compose("DestinationE/{id}", arguments = listOf(navArgument("id") { type = NavType.StringType })) {
          val viewModel = hiltNavGraphViewModel(it)
          val id = it.arguments?.getString("id")
          viewModel.setId(id)
          ScreenE(ViewModel)
      }
   }
}

您想从 C 移动到 E 和 popUpTo A 的示例。

navController.navigate("DestinationE".plus("/${data.id}")) {
                        popUpTo("DestinationA") {
                            inclusive = false
                        }
                    }