如何在Kotlin NavHost目标页面获取传递的路由参数？

问题背景 #

使用AndroidX Navigation的Kotlin DSL进行页面导航，已定义序列化路由类并完成跳转，但不清楚目标页面如何获取传递的参数：

@Serializable
data class TimerEntryRoute(
    val operation: String,
    // 其他参数
)

跳转代码示例：

NavHost(
    navController = navController,
    startDestination = HomeRoute,
    modifier = modifier
) {
    composable<HomeRoute> {
        HomeScreen(
            navigateToTimerEntry = { navController.navigate(TimerEntryRoute(operation = "ENTER")) }
        )
    }
}

疑问：如何在目标页面获取路由对象？是否必须用回退栈的toRoute函数？是否需要传递navController？有没有更简洁的实现？

解决方案 #

1. 在NavHost路由块中直接解析参数 #

在NavHost中添加TimerEntryRoute对应的composable块，通过backStackEntry.toRoute<T>()直接获取序列化的路由对象，再将所需参数传递给目标页面，无需给页面传递navController：

NavHost(
    navController = navController,
    startDestination = HomeRoute,
    modifier = modifier
) {
    composable<HomeRoute> {
        HomeScreen(
            navigateToTimerEntry = { navController.navigate(TimerEntryRoute(operation = "ENTER")) }
        )
    }
    // 新增TimerEntryRoute的路由处理
    composable<TimerEntryRoute> { backStackEntry ->
        // 解析得到完整路由对象
        val route = backStackEntry.toRoute<TimerEntryRoute>()
        // 将业务参数传递给目标页面
        TimerEntryScreen(
            operation = route.operation
            // 传递其他参数或回调
        )
    }
}

2. 目标页面直接接收业务参数 #

目标页面TimerEntryScreen只需定义所需的业务参数，无需依赖navController，保持组件独立性：

@Composable
fun TimerEntryScreen(
    operation: String,
    // 其他业务参数
) {
    // 页面逻辑直接使用operation参数即可
}

补充：页面内部需导航的处理 #

如果目标页面内部需要执行导航操作，无需从外部传递navController，可通过LocalNavController.current直接获取：

@Composable
fun TimerEntryScreen(
    operation: String,
) {
    val navController = LocalNavController.current
    
    Button(onClick = { navController.popBackStack() }) {
        Text("返回")
    }
}

关键说明 #

• 无需手动操作回退栈解析：backStackEntry.toRoute<T>()是官方Kotlin DSL提供的序列化路由解析方法，会自动完成参数的序列化与反序列化。
• 页面无需依赖navController：将参数解析逻辑放在NavHost的路由块中，页面只接收业务参数，符合组件解耦的设计原则。

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