问题描述
限时送ChatGPT账号..我有一个登录屏幕,当登录成功并且视图模型更新可变状态变量时,我的期望是调用一个新的可组合函数来显示新屏幕并删除登录屏幕.问题是,当显示新屏幕(又名 Screen.AccountsScreen
)时,其内容不断闪烁/重绘,登录表单也发生同样的事情,它永远不会被破坏(我知道这是因为日志消息'Recomponing...' 被无限打印).我认为这是因为 isLoginSuccessful
状态始终为真.看来我需要一个只能消费一次的事件,对吗?如果是这样,我该怎么做?
I have a login scren and when the login is successful and the view model updates the mutable state variable, my expectation is that a new composable function is called to show a new screen and the login one is removed. The problem is that when the new screen (aka Screen.AccountsScreen
) is shown, its content keeps flashing/redrawing and same thing happen with the login form which never gets destroyed (I know this because the log message 'Recomponing...' gets printed endless). I assume this happens because the isLoginSuccessful
state is always true. It seems I need an event that can be consumed only once, is this correct? If so, how can I do that?
LoginViewModel.kt
@HiltViewModel
class LoginViewModel @Inject constructor() : ViewModel() {
var isLoginSuccessful by mutableStateOf(false)
var errorMessage by mutableStateOf("")
fun onLoginClick(email: String, password:String) {
errorMessage = ""
if (credentialsValid(email, password)) {
isLoginSuccessful = true
} else {
errorMessage = "Email or password invalid"
isLoginSuccessful = false
}
}
}
LoginScreen.kt
@Composable
fun loginScreen(
navController: NavController,
viewModel: LoginViewModel = hiltViewModel()
) {
println("Recomponing...")
// Here gos the code for the login form
if (viewModel.isLoginSuccessful) {
navController.navigate(Screen.AccountsScreen.route) {
popUpTo(Screen.LoginScreen.route) { inclusive = true }
}
}
}
推荐答案
复合导航在过渡期间重新组合消失和出现的视图.这是预期的行为.
Composite navigation recomposes both disappearing and appearing views during transition. This is the expected behavior.
您在每次重新组合时都调用了导航.您的问题在于以下几行:
You're calling navigate on each recomposition. Your problem lays in these lines:
if (viewModel.isLoginSuccessful) {
navController.navigate(Screen.AccountsScreen.route) {
popUpTo(Screen.LoginScreen.route) { inclusive = true }
}
}
您不应直接从视图构建器更改状态.在这种情况下 LaunchedEffect
应该使用:
You shouldn't change state directly from view builders. In this case LaunchedEffect
should be used:
LaunchedEffect(viewModel.isLoginSuccessful) {
if (viewModel.isLoginSuccessful) {
navController.navigate(Screen.AccountsScreen.route) {
popUpTo(Screen.LoginScreen.route) { inclusive = true }
}
}
}
在副作用文档中查看更多信息.
Check out more in side effects documentation.
这篇关于为什么在 Compose 中使用喷气背包导航时视图会一直闪烁?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
更多推荐
[db:关键词]
发布评论