Jetpack Compose中点赞按钮无法动态切换图标是什么原因？

• remember 函数默认仅在首次组合时执行内部逻辑计算初始值，你没有为它添加监听的变化key，后续就算offer.likedByUser的值发生变更，thumbIcon的状态值也不会同步更新。
• 你修改的offer.likedByUser本身如果不是Compose可感知的State类型（例如没有用mutableStateOf包裹、也不是可观察数据流转换来的State对象），修改它的值不会触发界面重组，图标自然不会刷新。

方案1：直接绑定状态计算图标（更推荐） #

不需要单独维护图标状态变量，直接在Image的painter参数里根据点赞状态计算资源ID即可，代码更简洁：

// 注意需要先确保 offer.likedByUser 是 State 类型，比如声明为 var likedByUser by mutableStateOf(false)
IconButton(
    onClick = {
        offer.likedByUser = !offer.likedByUser
    } 
) {
    Image(
        painter = painterResource(
            id = if (offer.likedByUser) R.drawable.ic_thumb_up_selected else R.drawable.ic_thumb_up
        ),
        contentDescription = "点赞"
    )
}

方案2：为remember添加依赖key #

如果确实需要单独维护thumbIcon变量，给remember添加offer.likedByUser作为依赖key，当key发生变化时，remember会自动重新执行内部逻辑更新状态值：

var thumbIcon by remember(offer.likedByUser) {
    mutableStateOf(if (offer.likedByUser) R.drawable.ic_thumb_up_selected else R.drawable.ic_thumb_up)
}

IconButton(
    onClick = {
        offer.likedByUser = !offer.likedByUser
    } 
) {
    Image(painter = painterResource(id = thumbIcon), contentDescription = "点赞")
}

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