更新mutableStateOf后LazyColumn未触发重组，原因是什么？

我写了下面这个基础Composable：

var timer by remember { mutableStateOf(0) }
Column {
    Text(text = timer.toString())
    Button(onClick = { timer++ }) {
        Text(text = "Add")
    }
}

点击按钮时，内部状态timer会加1，因为它被用在Text组件里，会触发重组。但把Column替换成LazyColumn之后：

var timer by remember { mutableStateOf(0) }
LazyColumn {
    item(contentType = "timer") {
        Text(text = timer.toString())
    }
    item {
        Button(onClick = { timer++ }) {
            Text(text = "Add")
        }
    }
}

状态明明已经变更了，却没触发重组，这是为什么？

这是因为LazyColumn的item块运行在自身的懒加载作用域中，而非父Composable的重组作用域。

当你在LazyColumn的item里直接引用外部定义的timer时，这个状态读取没有被注册到父Composable的重组触发器里，反而被归到了LazyColumn的懒加载机制中。但LazyColumn的item默认只会在首次渲染或列表项可见性变化时检查状态，不会主动监听外部状态的变更来触发对应项的重组。

解决起来很简单，两种常用方法：

方法1：将状态使用的部分抽成独立Composable #

把依赖状态的Text包装成单独的Composable，让状态读取被正确关联到重组节点：

var timer by remember { mutableStateOf(0) }
LazyColumn {
    item(contentType = "timer") {
        TimerText(timer)
    }
    item {
        Button(onClick = { timer++ }) {
            Text(text = "Add")
        }
    }
}

@Composable
fun TimerText(timer: Int) {
    Text(text = timer.toString())
}

方法2：使用rememberUpdatedState追踪状态变更 #

在item块内用rememberUpdatedState包裹状态，确保状态变化能被感知：

var timer by remember { mutableStateOf(0) }
LazyColumn {
    item(contentType = "timer") {
        val currentTimer by rememberUpdatedState(timer)
        Text(text = currentTimer.toString())
    }
    item {
        Button(onClick = { timer++ }) {
            Text(text = "Add")
        }
    }
}

核心逻辑就是：LazyColumn的item是懒加载作用域，外部状态的读取需要明确绑定到可被Compose追踪的重组节点上，否则状态变更无法触发对应列表项的重组。

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