📘 Compose 状态管理 从入门到精通

⚡ 第二讲 · remember 与 mutableStateOf 🎯 核心基础
🧠 remember 的作用

remember 是 Compose 中用于缓存值的工具。在重组(Recomposition)时,
它帮助 Composable 函数记住之前计算的结果,避免重复初始化。

特性说明学生友好比喻 🎒
💾 缓存重组时不重新计算,保留上次的值像书包里的文具,每天不用重新买
🔄 生命周期与 Composable 在组合树中的位置绑定座位不变,课本就一直放在桌上
🧩 键参数可传入 keys,key 变化时重新计算换课表了才换课本
⚙️ 结合状态常与 mutableStateOf 搭配,驱动重组值变了,黑板上的数字才擦掉重写
// 典型用法:remember 缓存一个对象
val count = remember { mutableStateOf(0) }
// 或者使用 by 委托 (更简洁)
var count by remember { mutableStateOf(0) }

📌 remember 保证重组时 mutableStateOf(0) 只创建一次,
后续重组直接读取已有状态,不会重置为 0。

🔧 mutableStateOf 创建可变状态

mutableStateOf 创建一个 可观察 的容器,当值改变时,
Compose 会自动调度重组。

📦 创建方式

  • mutableStateOf(初始值)
  • 支持 Int, String, Boolean, 数据类…
  • 返回 MutableState<T>

✨ 特点

  • 读取触发重组 (Snapshot 系统)
  • 线程安全 (Compose 内部优化)
  • 与 remember 天生一对
// 创建各种可变状态
var name by remember { mutableStateOf("小明") }
var age by remember { mutableStateOf(8) }
var isHappy by remember { mutableStateOf(true) }
📖 状态读取与更新

读取状态时,Compose 自动追踪依赖;更新时触发重组。

📖 读取状态 Composable 读取 ✏️ 更新状态 count = newValue 重组 读取时建立依赖 · 更新时触发重组
// 读取:直接在 Composable 中使用 count
Text(text = "点击次数: $count")

// 更新:通过 setter 或 委托赋值
Button(onClick = { count++ }) {
    Text("➕ 加一")
}

🔄 每次 count++ 执行,所有读取 count 的 Composable 都会智能重组。

⚙️ 重组机制 · 细粒度更新
🧪 重组 (Recomposition) 是指当状态变化时,Compose 重新执行受影响的 Composable 函数,
只更新变化的部分,而非整个界面。这是 Compose 高性能的关键。
📦 状态 mutableStateOf 📸 Snapshot 观察变化 🔄 重组 Recompose 📋 重组范围 仅读取了状态的 Composable 跳过未依赖的组件 ⚡ 智能跳过 稳定类型 & 不变参数 跳过不必要的重组

💡 重组是声明式的:你描述界面应如何反映状态,Compose 自动处理更新。

// 重组示例:只有 count 变化时,Text 重组,Button 不重组
@Composable
fun CounterApp() {
    var count by remember { mutableStateOf(0) }
    Column {
        Text("数值: $count")          // ① 依赖 count
        Button(onClick = { count++ }) {   // ② 不读取 count,不重组
            Text("增加")
        }
    }
}
📌 核心速记 · 一表掌握
概念作用口诀
remember缓存值,避免重组时重置📦 记住上一次
mutableStateOf创建可观察可变状态🔔 变了就通知
状态读取建立依赖关系👀 读谁依赖谁
状态更新触发重组✍️ 改了就重绘
重组机制最小范围更新🎯 只改受影响的部分