Jetpack Compose项目中能否用mutableStateOf替代produceState？

问题1：能否使用mutableStateOf替代produceState？若可以对应代码如何编写？ #

可以替代。produceState是Compose封装的便捷API，内部本质就是基于mutableStateOf + LaunchedEffect实现的，作用是将非State数据源转换为Compose可观察的State对象，同时自动管理协程生命周期。

替代代码如下：

@Composable
fun DetailsScreen(
    onErrorLoading: () -> Unit,
    modifier: Modifier = Modifier,
    viewModel: DetailsViewModel = viewModel()
) {
    // 用mutableStateOf定义初始状态，和原produceState初始值一致
    var uiState by remember { mutableStateOf(DetailsUiState(isLoading = true)) }

    // 等效于produceState的执行逻辑，key传Unit保证只在页面首次进入时执行一次
    LaunchedEffect(Unit) {
        val cityDetailsResult = viewModel.cityDetails
        uiState = if (cityDetailsResult is Result.Success<ExploreModel>) {
            DetailsUiState(cityDetailsResult.data)
        } else {
            DetailsUiState(throwError = true)
        }
    }

    when {
        uiState.cityDetails != null -> {
            // 原有逻辑保持不变
            ...
        }
        // 其余分支不变
    }
}

问题2：为什么代码B无法在该项目中正常使用？ #

代码B存在三个核心问题导致无法正常运行：

• 没有状态监听能力：代码B里的uiState是普通的Kotlin变量，不是Compose的State类型，就算后续数据发生变化也无法触发界面重组，界面会一直停留在初始状态不会更新。
• 丢失初始加载状态：原代码的初始状态是isLoading=true，可以在数据加载阶段展示加载中UI；代码B进入页面直接读取viewModel.cityDetails的结果，没有加载状态，要么直接展示成功/失败页面，要么如果数据加载是异步逻辑的话会直接拿空结果报错。
• 重复执行查询逻辑：每次DetailsScreen触发重组时，都会重新执行viewModel.cityDetails的get方法，重复查询仓库数据，造成不必要的性能损耗；如果查询是耗时IO操作，还会直接阻塞主线程导致界面卡顿。

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