如何在Jetpack Compose中让回调函数变量可变？

问题原因 #

你当前的selectedView是普通变量，修改它不会触发Compose的重组机制，所以视图不会更新。需要将其转为Compose的状态变量，这样变量变化时才会自动触发重组，更新显示内容。

快速修复方案 #

使用remember和mutableStateOf将变量包装为可观察状态：

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun CurrentView() {
    // 转为Compose状态变量，确保修改时触发重组
    var selectedView by remember { mutableStateOf<@Composable () -> Unit>({ testView() }) }

    Scaffold(
        bottomBar = {
            CustomNavBar(navBarItems){
                selectedView = it
            }
        }
    ) { padding ->
        Box(
            modifier = Modifier
                .fillMaxSize()
                .padding(padding),
            contentAlignment = Alignment.Center
        ) {
            selectedView() // 直接调用选中的Composable视图
        }
    }
}

更优实践：使用枚举管理视图类型 #

如果需要让选中状态在屏幕旋转等配置变更后保留，或者追求更清晰的代码结构，建议使用枚举来标识视图类型，而非直接存储Composable函数引用：

1. 定义视图类型枚举 #

enum class ViewType {
    Test, Invite, Messages, Groups
}

2. 更新导航项数据结构 #

data class NavBarItem(
    val title: String,
    val icon: ImageVector,
    val viewType: ViewType
)

val navBarItems = listOf(
    NavBarItem("Invite", Icons.Outlined.Send, ViewType.Invite),
    NavBarItem("Messages", Icons.Outlined.Menu, ViewType.Messages),
    NavBarItem("Groups", Icons.Outlined.AccountCircle, ViewType.Groups)
)

3. 重构CurrentView #

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun CurrentView() {
    // 使用rememberSaveable确保状态跨配置变更保留
    var selectedViewType by rememberSaveable { mutableStateOf(ViewType.Test) }

    Scaffold(
        bottomBar = {
            CustomNavBar(navBarItems){ viewType ->
                selectedViewType = viewType
            }
        }
    ) { padding ->
        Box(
            modifier = Modifier
                .fillMaxSize()
                .padding(padding),
            contentAlignment = Alignment.Center
        ) {
            // 根据枚举值渲染对应视图
            when(selectedViewType) {
                ViewType.Test -> testView()
                ViewType.Invite -> testView1()
                ViewType.Messages -> testView2()
                ViewType.Groups -> testView3()
            }
        }
    }
}

这种方式的优势：

• 状态可持久化，不受配置变更影响
• 代码更具可读性和可维护性，视图类型清晰明确
• 避免直接存储函数引用可能带来的潜在问题

内容的提问来源于stack exchange，提问作者J. Edgell