State Hoosting 核心原理

State Hoisting（状态提升）是 Jetpack Compose 中管理 UI 状态的核心模式。它将可组合函数内部的状态“提升”到调用方，使得组件成为无状态（stateless）的纯展示单元，从而实现状态与 UI 的解耦、复用和可测试。

状态提升定义

状态提升的本质是将 remember 管理的可变状态从子组件中移动到父组件（或 ViewModel），子组件只接收不可变的状态值和一个事件回调（lambda），不直接持有或修改状态。

单向数据流（UDF）

State Hoisting 天然遵循单向数据流（Unidirectional Data Flow）原则：

1. 事件（Event）：用户操作（点击、输入）从 UI 向上传递。
2. 状态（State）：组件状态从上层（ViewModel / 父 Composable）向下传递。
3. 数据不变性：子组件不能修改状态，只能通过回调上报事件。

提升层次选择

状态应该提升到“最需要它的最近共同父级”。支付流程中常见层次选择规则：

• 局部 UI 状态（如输入框文本）：提升到当前屏幕的 Composable 内，使用 remember 就地管理。
• 跨组件状态（如支付金额、商品清单）：提升到屏幕级 ViewModel 中。
• 全局状态（如用户会话、支付 ）：使用 ViewModel + 依赖注入，或 Compose 的 CompositionLocal 但慎用。

与 ViewModel 的关系

ViewModel 是状态提升的天然承载者。在 Compose 中，ViewModel 通过 viewModel() 函数获取，其内部使用 StateFlow 或 MutableState 暴露状态，Composable 通过 collectAsState() 转为 Compose State。

典型代码模式：

// ViewModel
class PaymentViewModel : ViewModel() {
    private val _amount = mutableStateOf("")
    val amount: State<String> = _amount

    fun onAmountChanged(new: String) {
        // 校验、格式化等业务逻辑
        _amount.value = new
    }

    val isSubmitEnabled: State<Boolean> = derivedStateOf {
        amount.value.isNotBlank() && amount.value.toDoubleOrNull() != null
    }
}

// Composable 层
@Composable
fun PaymentScreen(viewModel: PaymentViewModel = viewModel()) {
    val amount by viewModel.amount
    val enabled by viewModel.isSubmitEnabled
    AmountInputField(value = amount, onValueChange = viewModel::onAmountChanged)
    SubmitButton(enabled = enabled)
}

@Composable
fun AmountInputField(value: String, onValueChange: (String) -> Unit) {
    TextField(value = value, onValueChange = onValueChange)
}

@Composable
fun SubmitButton(enabled: Boolean) {
    Button(onClick = { /* 提交 */ }, enabled = enabled) {
        Text("提交支付")
    }
}

调试与常见错误

• 错误：子组件内部使用 remember 并直接修改状态，导致父子状态不一致。应遵循“状态由父级提供，事件回调上报”。
• 调试技巧：在 ViewModel 中记录 SnapshotStateObserver 或使用 Android Studio 的 Layout Inspector 查看重组原因。
• 性能注意：状态提升到过高层次会导致不必要的重组，应保持提升的“最小必要层次”。

掌握 State Hoisting 的核心原理，是构建稳定、可复用支付流程 UI 组件的基础。下一节将深入具体支付表单的状态提升实现。