Jetpack Compose的AlertDialog示例代码为什么需要使用remember关键字？

问题相关示例代码 #

@Composable
fun AlertDialogSample() {
    MaterialTheme {
        Column {
            val openDialog = remember { mutableStateOf(false)  }

            Button(onClick = {
                openDialog.value = true
            }) {
                Text("Click me")
            }

            if (openDialog.value) {

                AlertDialog(
                    onDismissRequest = {
                        openDialog.value = false
                    },
                    title = {
                        Text(text = "Dialog Title")
                    },
                    text = {
                        Text("Here is a text ")
                    },
                    confirmButton = {
                        Button(
                            onClick = {
                                openDialog.value = false
                            }) {
                            Text("This is the Confirm Button")
                        }
                    },
                    dismissButton = {
                        Button(
                            onClick = {
                                openDialog.value = false
                            }) {
                            Text("This is the dismiss Button")
                        }
                    }
                )
            }
        }
    }
}

问题解答 #

remember的核心作用是在Composable重组过程中保留状态实例，避免被重新初始化，和你是不是手动修改状态值没有关系，这是Compose的运行机制决定的：
Composable函数会在关联的可观察状态更新时触发重组，也就是整个函数逻辑会从头重新执行。如果去掉remember，你可以模拟完整的执行流程就能看到问题：

1. 首次加载页面，AlertDialogSample执行，openDialog初始化为false，页面仅显示按钮
2. 点击按钮把openDialog.value改为true，触发AlertDialogSample重组
3. 重组时函数重新执行，val openDialog = mutableStateOf(false)会重新运行，新创建一个值为false的State对象覆盖原有实例
4. 此时openDialog.value回到初始值false，弹窗判断条件不成立，永远无法显示

加上remember之后，mutableStateOf(false)只会在Composable首次加载时执行一次，后续所有重组都会复用第一次创建的State实例，你手动修改的value值才能被保留，弹窗的显示隐藏逻辑才能正常生效。

你可以自行测试：去掉代码中的remember后运行，点击按钮不会弹出任何弹窗，就是因为重组直接重置了状态值。

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