[英]When using List as State, how to update UI when item`attribute change in Jetpack Compose?
For example, I load data into a List, it`s wrapped by MutableStateFlow, and I collect these as State in UI Component.例如,我将数据加载到一个列表中,它由 MutableStateFlow 包装,我在 UI 组件中将这些收集为 State。
The trouble is, when I change an item in the MutableStateFlow<List>, such as modifying attribute, but don`t add or delete, the UI will not change.麻烦的是,当我更改 MutableStateFlow<List> 中的项目时,例如修改属性,但不添加或删除,UI 不会改变。
So how can I change the UI when I modify an item of the MutableStateFlow?那么,当我修改 MutableStateFlow 的一项时,如何更改 UI?
These are codes:这些是代码:
ViewModel:视图模型:
data class TestBean(val id: Int, var name: String)
class VM: ViewModel() {
val testList = MutableStateFlow<List<TestBean>>(emptyList())
fun createTestData() {
val result = mutableListOf<TestBean>()
(0 .. 10).forEach {
result.add(TestBean(it, it.toString()))
}
testList.value = result
}
fun changeTestData(index: Int) {
// first way to change data
testList.value[index].name = System.currentTimeMillis().toString()
// second way to change data
val p = testList.value[index]
p.name = System.currentTimeMillis().toString()
val tmplist = testList.value.toMutableList()
tmplist[index].name = p.name
testList.update { tmplist }
}
} }
UI:用户界面:
setContent {
LaunchedEffect(key1 = Unit) {
vm.createTestData()
}
Column {
vm.testList.collectAsState().value.forEachIndexed { index, it ->
Text(text = it.name, modifier = Modifier.padding(16.dp).clickable {
vm.changeTestData(index)
Log.d("TAG", "click: ${index}")
})
}
}
}
Both Flow
and Compose mutable state cannot track changes made inside of containing objects. Flow
和 Compose 可变 state 都无法跟踪包含对象内部所做的更改。
But you can replace an object with an updated object. data class
is a nice tool to be used, which will provide you all copy
out of the box, but you should emit using var
and only use val
for your fields to avoid mistakes.但是你可以用更新的 object 替换 object。
data class
是一个很好用的工具,它会为你提供开箱即用的所有copy
,但你应该使用var
发出并且只对你的字段使用val
以避免错误。
Check out Why is immutability important in functional programming?查看为什么不变性在函数式编程中很重要?
testList.value[index] = testList.value[index].copy(name = System.currentTimeMillis().toString())
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.