Compose生命周期---Lifecycle of composables

在 Jetpack Compose 中,生命周期与传统 View 系统 (Activity / Fragment) 的生命周期大不相同。Compose 是声明式的 UI 框架,UI 是由状态驱动生成的,其生命周期依赖于「组合(Composition)」和「重组(Recomposition)」过程,以及副作用(Side Effects)的控制。

一、Compose 的生命周期结构

阶段 含义 类比传统Android生命周期
Composition(组合) 第一次调用 @Composable 构建 UI onCreate() / onStart()
Recomposition(重组) 状态变化时,自动刷新相关 UI 部分 onResume()(多次执行)
Disposal(释放) UI 不再需要,Compose 会清理资源 onPause() / onDestroy()

二、生命周期相关的 Compose 函数(副作用 API)

副作用函数是 Compose 提供的"生命周期钩子",可安全地进行如网络请求、监听器注册、清理任务等。

✅ 1. LaunchedEffect 组件进入组合或 key 变化时执行协程代码(只执行一次或条件变化时重新执行)

kotlin 复制代码
@Composable
fun MyScreen(userId: String) {
    LaunchedEffect(userId) {
        // 初始加载或 userId 改变时触发
        val userData = loadUser(userId)
        println("Loaded user: $userData")
    }
}

支持 CoroutineScope,适合做网络请求、动画、延迟等

常用于:页面加载、初始化数据

✅ 2. DisposableEffect

组件进入组合时初始化,在离开组合时释放资源

kotlin 复制代码
@Composable
fun LifecycleAwareComponent(someKey: String) {
    DisposableEffect(someKey) {
        println("Component active with key: $someKey")

        onDispose {
            println("Component with key $someKey is disposed")
        }
    }
}

常用于:注册广播、监听器、传感器等资源释放相关场景

✅ 3. SideEffect

每次重组后立即执行,适合和外部系统同步状态

kotlin 复制代码
@Composable
fun MyComponent(count: Int) {
    SideEffect {
        println("Current count is $count")
    }
}

✅ 4. rememberUpdatedState

用于保证 LaunchedEffect 或 DisposableEffect 中使用到的 lambda 是最新的版本

kotlin 复制代码
@Composable
fun TimerEffect(onTick: () -> Unit) {
    val currentOnTick by rememberUpdatedState(onTick)

    LaunchedEffect(Unit) {
        while (true) {
            delay(1000)
            currentOnTick()  // always calls the latest lambda
        }
    }
}

解决"捕获旧 lambda"的问题

🎯 三、搭配 LifecycleOwner 使用(配合 ViewModel)

在某些场景中,我们需要访问宿主组件(如 Activity/Fragment)的生命周期:

kotlin 复制代码
@Composable
fun ObserveLifecycleEvents() {
    val lifecycleOwner = LocalLifecycleOwner.current

    DisposableEffect(lifecycleOwner) {
        val observer = LifecycleEventObserver { _, event ->
            println("Lifecycle event: $event")
        }

        lifecycleOwner.lifecycle.addObserver(observer)

        onDispose {
            lifecycleOwner.lifecycle.removeObserver(observer)
        }
    }
}

🔄 生命周期对比表

传统生命周期 Compose 替代
onCreate() LaunchedEffect(Unit)
onResume() LaunchedEffect(key)
onPause() / onStop() onDispose in DisposableEffect
onDestroy() onDispose
状态绑定 View 状态驱动组合 UI

✅ 小结

API 触发时机 用途
LaunchedEffect 初次组合或 key 变化 异步任务、网络请求
DisposableEffect 组合 + 清理 注册监听、取消绑定
SideEffect 每次重组后 外部同步、日志记录
rememberUpdatedState 始终使用最新值 动态回调、协程中更新状态
LocalLifecycleOwner 获取宿主生命周期 与原生协同工作
相关推荐
江拥羡橙38 分钟前
Vue和React怎么选?全面比对
前端·vue.js·react.js
楼田莉子2 小时前
Qt开发学习——QtCreator深度介绍/程序运行/开发规范/对象树
开发语言·前端·c++·qt·学习
暮之沧蓝2 小时前
Vue总结
前端·javascript·vue.js
木易 士心3 小时前
Promise深度解析:前端异步编程的核心
前端·javascript
im_AMBER3 小时前
Web 开发 21
前端·学习
又是忙碌的一天3 小时前
前端学习day01
前端·学习·html
Joker Zxc3 小时前
【前端基础】20、CSS属性——transform、translate、transition
前端·css
excel3 小时前
深入解析 Vue 3 源码:computed 的底层实现原理
前端·javascript·vue.js
大前端helloworld3 小时前
前端梳理体系从常问问题去完善-框架篇(react生态)
前端
不会算法的小灰4 小时前
HTML简单入门—— 基础标签与路径解析
前端·算法·html