您可以将 NavHostController 传递给子 Composable 以允许访问 navController.navigate("Route") 吗？

Question

我是 Jetpack Compose 的新手，正在努力了解如何将导航库与 Compose 集成。 我已经成功实现了底部导航，但现在很难访问子组件中的 .navigate("route") 方法。我应该将 navController 作为 NavHost 内可组合项的参数传递吗？这是我的代码，让事情变得更清楚。

这是我的 HomeScreen.kt @Composable，它调用 RememberNavController() 方法以及 NavHost() 可组合项，如下...

@Composable
fun HomeScreen() {
val navController = rememberNavController()
...
Scaffold(
   ...
) {
    NavHost(navController, startDestination = "route") {
        composable("route") { Settings(navController) }
  } 
}

所以在这里您可以看到我将 navController 作为参数传递给“设置”可组合项。我不确定这是否正确。现在，最终从“设置”可组合项中，我想访问 navController.navigate("route") 方法（如果可能的话），类似于以下内容。

@Composable
fun Settings(navController: NavHostController) {
   ...
   Button(onClick = {navController.navigate("route")}) {
        Text(text = "button text")
    }
   ...
}

不幸的是，我无法访问 .navigate 方法，因为它显示“无法使用提供的参数调用以下函数。”感谢您的时间和帮助！！

Answer 1

navigate("route")

方法是扩展方法。因此，您必须显式导入它：

import androidx.navigation.compose.navigate

Answer 2

您可以像在代码中一样传入

navController

，但最好将事件作为设置屏幕的可组合参数，并传入函数以导航到声明

navHost

的位置。这将遵循单一事实来源原则并使其更容易测试。

来自文档：

MyAppNavHost 可组合函数作为 NavController 实例的单一事实来源。 ProfileScreen 将事件公开为当用户点击按钮时调用的函数。 MyAppNavHost 负责导航到应用程序中的不同屏幕，在调用 ProfileScreen 时将导航调用到正确的目的地。

    @Composable
fun MyAppNavHost(
    modifier: Modifier = Modifier,
    navController: NavHostController = rememberNavController(),
    startDestination: String = "profile"
) {
    NavHost(
        modifier = modifier,
        navController = navController,
        startDestination = startDestination
    ) {
        composable("profile") {
            ProfileScreen(
                onNavigateToFriends = { navController.navigate("friendsList") },
                /*...*/
            )
        }
        composable("friendslist") { FriendsListScreen(/*...*/) }
    }
}

@Composable
fun ProfileScreen(
    onNavigateToFriends: () -> Unit,
    /*...*/
) {
    /*...*/
    Button(onClick = onNavigateToFriends) {
        Text(text = "See friends list")
    }
}