如何使用 navController 在 Jetpack Compose 中从一个屏幕导航到另一个屏幕？

Question

我有这样的结构：

val navController = rememberNavController()
NavHost(
    navController = navController,
    startDestination = "auth"
) {
    composable(
        route = "auth"
    ) {
        AuthScreen(
            navController = navController
        )
    }
    composable(
        route = "profile"
    ) {
        ProfileScreen(
            navController = navController
        )
    }
}

当我第一次打开应用程序时，根据身份验证状态显示屏幕：

if (!viewModel.isUserAuthenticated) {
    AuthScreen(navController = navController)
} else {
    ProfileScreen(navController = navController)
}

效果很好。问题来了，当我尝试在 AuthScreen 中输入时：

when(val response = authViewModel.signInState.value) {
    is Response.Loading -> CircularProgressIndicator()
    is Response.Success -> {
        if (response.data) {
            navController.navigate("profile")
            Log.d(TAG, "Success")
        }
    }
    is Response.Error -> Log.d(TAG, response.message)
}

日志语句打印“成功”，但没有导航到下一个 ProfileScreen。如何解决？

Answer 1

您可以从 setContent 中删除 if-else。相反，将 ProfileScreen 作为主页目的地，您可以在其中检查用户是否已通过身份验证。如果他不在，请导航至 AuthScreen

@Composable
fun ProfileScreen(navController: NavController) {
    LaunchedEffect(Unit) {
        if(!viewModel.isUserAuthenticated) {
            navController.navigate("auth")
        }
    }
}

如果用户可以从此屏幕注销（即身份验证状态可以更改），则不要使用 Unit，而是使用 viewModel.isUserAuthenticated 作为 LaunchedEffect 的密钥（假设 isUserAuthenticated 是 State)

如何使用 navController 在 Jetpack Compose 中从一个屏幕导航到另一个屏幕？

How to navigate from a screen to another in Jetpack Compose using navController?

android

kotlin

android-architecture-navigation

android-jetpack-compose