Jetpack Compose中如何正确创建列表可变状态？遇MutableList访问错误

错误原因分析 #

你遇到的cannot access kotlin.collections.mutableList错误，根源在这两处：

1. inputs是用val声明的不可变引用，不能通过inputs = ...重新赋值。
2. inputs + name会生成一个新的列表对象，而非修改mutableStateListOf创建的原状态列表，Compose无法感知这种变化，同时赋值操作本身也违反了val的不可变性。

正确实现方式 #

mutableStateListOf创建的是支持Compose状态感知的可变列表，直接调用它的add/remove等方法就能修改列表内容，Compose会自动触发重组更新UI。修正后的代码如下：

@Composable
fun CreateBar(){
    var name by remember { mutableStateOf("") }
    // 用val声明，我们要修改的是列表内容而非引用
    val inputs = remember { mutableStateListOf<String>() }
    Column {
        Row( 
            modifier = Modifier
                .fillMaxWidth()
                .padding(20.dp , 60.dp),
            horizontalArrangement = Arrangement.Center,
            verticalAlignment = Alignment.CenterVertically
        ) {
            TextField(
                value = name,
                onValueChange = { text ->
                    name = text
                }
            )
            Button(
                onClick = {
                    // 直接调用add方法修改状态列表
                    inputs.add(name)
                    // 可选：添加后清空输入框，优化体验
                    name = ""
                }
            ) {
                Icon(
                    imageVector = Icons.Default.Search,
                    contentDescription = "添加输入内容",
                    modifier = Modifier.height(45.dp)
                )
            }
        }
        LazyColumn {
            items(inputs){ input ->
                Text("this is $input")
            }
        }
    }
}

关键要点 #

• 状态列表的修改方式：mutableStateListOf实现了MutableList接口，所有标准的可变列表操作（add、remove、clear等）都能直接使用，且操作会被Compose感知，触发UI重组。
• 引用不可变：用val声明状态列表，避免不必要的引用替换，确保Compose能持续监听同一个列表的内容变化。
• 输入优化：添加元素后清空输入框是常见的用户体验优化，避免重复添加同一内容。

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