【问题标题】:Android Compose lazycolumn does not update when livedata is changed更改实时数据时,Android Composelazycolumn 不更新
【发布时间】:2022-01-01 08:58:17
【问题描述】:

我有一个项目列表,其中每个项目都有一个复选框。复选框的状态需要存储在viewmodel 中,最好viewmodel 中的列表应该是唯一的真实来源。

@Composable
fun Screen(viewModel: ViewModel) {
    val list by viewModel.items.observeAsState()

    LazyColumn {
        list?.let { items ->
            items(items) { item -> 
                ListItem(
                    text = {
                        Text(item.name)
                    },
                    secondaryText = {
                        Text(item.phoneNumber)
                    },
                    icon = {
                        Checkbox(
                            modifier = Modifier.padding(8.dp),
                            checked = item.selected,
                            onCheckedChange = {
                                //TODO

                            }
                        )
                    }
                )
            }
        }
    }
}

我尝试通过更新onCheckedChange 回调中的列表(viewmodel 中的MutableLiveData<List<Object>>)来更新item.selected,但UI 没有更新。如果我向下滚动然后向上滚动 UI 更新并且复选框似乎被选中。为什么不更新?

【问题讨论】:

    标签: android-jetpack-compose android-livedata android-jetpack lazycolumn


    【解决方案1】:

    MutableLiveData 对它持有的对象一无所知。当某些内部对象属性更新时,它无法向您发送新值。

    要使用实时数据解决此问题,您需要为您的项目设置新值,设置相同的值就足够了:

    fun setSelected(index: Int, selected: Boolean) {
        items.value!![index].selected = selected
        items.value = items.value
    }
    

    但是如果你没有被其他依赖绑定到LiveData,我建议你不要使用它。将mutableStateListOf 与不可变的data class 一起使用会更简洁:

    data class Object(val selected: Boolean)
    
    class VM: ViewModel() {
        val items = mutableStateListOf<Object>()
    
        fun setSelected(index: Int, selected: Boolean) {
            items[index] = items[index].copy(selected = selected)
        }
    }
    

    在这两种情况下,都需要对象索引,可以通过itemsIndexed获取:

    val list = viewModel.items
    LazyColumn {
        itemsIndexed(list) { index, item -> 
            // ...
            onCheckedChange = {
                viewModel.setSelected(index, it)
            }
        // ...
        }
    }
    

    【讨论】:

      猜你喜欢
      • 2010-12-31
      • 2019-08-14
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2010-12-05
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多