When I modify the properties of the objects in the List, the UI does not update

my code：

    @OptIn(ExperimentalFoundationApi::class)
    @Composable
    fun ContactCard(
    ) {
        var stateList = remember {
            mutableStateListOf<ListViewData>()
        }
        viewModel!!.recordRespListLiveData!!.observe(this) { it ->
            it.forEach {
                stateList.add(ListViewData(false, it))
            }
        }
        LazyColumn() {
            stateList.forEachIndexed { index, bean ->
                stickyHeader() {
                    Box(Modifier.clickable {
                        stateList[index].visible = true
                    }) {
                        ContactNameCard(bean.data.contact, index)
                    }
                }
                items(bean.data.records) { data ->
                    if (bean.visible) {
                        RecordItemCard(record = data)
                    }
                }
            }
        }
    }

When I click on the Box, visible is set to true, but the RecordItemCard doesn't show，why？

CodePudding user response：

For SnapshotList to trigger you need to add, delete or update existing item with new instance. Currently you are updating visible property of existing item.

If ListViewData is instance from data class you can do it as

stateList[index] = stateList[index].copy(visible = true)