Jetpack Compose - LazyColumnFor 在添加项目时不重组

Question

我正在尝试在 Jetpack Compose 中创建一个项目列表，当底层数据发生变化时它会自动更新，但它没有更新，而且我无法在 LazyColumnFor 最初组合后将项目添加到它。

private var latestMessages = mutableListOf<ChatMessage>()

override fun onCreateView(
    inflater: LayoutInflater, container: ViewGroup?,
    savedInstanceState: Bundle?
): View {
    return ComposeView(context = requireContext()).apply {
        setContent {
            LatestMessages(latestMessages)
        }
    }
}

@Composable
fun LatestMessages(messages: MutableList<ChatMessage>) {
    Column {
        LazyColumnFor(items = messages) { chatMessage ->
            LatestMessageItem(chatMessage) {
                // onclick
            }
        }
    }
    Box(alignment = Alignment.Center) {
        Button(onClick = {
            latestMessages.add(
                    ChatMessage(
                            "testId",
                            "testText2",
                            "testFromId2",
                            "testToId",
                            "timestamp",
                            0
                    )
            )
        }) {

        }
    }
}

盒子里的按钮只是为了测试添加一个项目。据我了解，只要底层数据发生变化，LazyColumnFor 就应该更新，类似于 SwiftUI 中的 ForEach。我做错了什么？

Answer 1

编辑 2022 年 3 月

Jetpack compose 不再使用 LazyColumnFor 所以我更新了答案以反映 compose 的当前状态。

Jetpack compose 总是需要在重组发生之前修改状态对象。您需要使用 MutableStateList<T>。您可以传递对它的引用并在任何接受 SnapShotStateList<T>

的方法中更新

override fun onCreateView(
    inflater: LayoutInflater, container: ViewGroup?,
    savedInstanceState: Bundle?
): View {
    
    return ComposeView(context = requireContext()).apply {
        setContent {
            val latestMessages = mutableStateListOf<ChatMessage>()
            LatestMessages(latestMessages)
        }
    }
}

@Composable
fun LatestMessages(messages: SnapshotStateList<ChatMessage>) {
    Column {
        LazyColumn { 
            items(messages){ chatMessage ->
                LatestMessageItem(chatMessage) {
                // onclick
                }
         }
      }
    Box(alignment = Alignment.Center) {
        Button(onClick = {
            latestMessages.add(
                ChatMessage(
                    "testId",
                    "testText2",
                    "testFromId2",
                    "testToId",
                    "timestamp",
                    0
                )
            )
        }) {

        }
    }
}

Jetpack Compose - LazyColumnFor 在添加项目时不重组

Jetpack Compose - LazyColumnFor not recomposing when item added

android

kotlin

android-jetpack-compose