Jetpack Compose开发中如何在Handler中实现页面导航？

问题原因 #

• 你直接在@Composable顶层调用Handler.postDelayed，每次Composable触发重组都会提交新的延迟任务，多次重组会导致重复跳转逻辑异常。
• 传入Thread对象属于不必要的写法，postDelayed接收的参数类型是Runnable。

推荐实现方案 #

直接用Compose原生的LaunchedEffect副作用API实现，该API仅会在key值不变的情况下首次进入组合时执行一次，且会自动绑定Composable生命周期，页面销毁时自动取消任务，不会出现内存泄漏：

@Composable
fun GoToMainScreen(navController: NavHostController) {
    // key设为Unit，仅第一次进入当前Composable时执行一次
    LaunchedEffect(key1 = Unit) {
        // 延时4秒
        delay(4000L)
        navController.navigate("main_screen")
        Log.i("LOOPER", "It got here!")
    }
}

如果你坚持要使用Handler实现 #

需要用DisposableEffect包裹，同时在页面退出时移除未执行的回调，避免内存泄漏和无效跳转：

@Composable
fun GoToMainScreen(navController: NavHostController) {
    DisposableEffect(key1 = Unit) {
        val runnable = Runnable {
            navController.navigate("main_screen")
            Log.i("LOOPER", "It got here!")
        }
        val handler = Handler(Looper.getMainLooper())
        handler.postDelayed(runnable, 4000L)
        // 页面退出时移除未执行的任务
        onDispose {
            handler.removeCallbacks(runnable)
        }
    }
}

额外注意事项 #

• 若不需要用户按返回键回到启动页，跳转时可以将启动页从返回栈中移除，写法如下：

navController.navigate("main_screen") {
    popUpTo("你的启动页路由ID") {
        inclusive = true
    }
}

• 所有非UI渲染的副作用操作（延时、网络请求、跳转等）都不能直接放在@Composable顶层执行，必须通过Compose提供的副作用API包裹，避免重组导致逻辑重复执行。

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