Question

我在屏幕上有一个可组合的，它显示了轨道项目（收藏夹）的列表：

var favourites: MutableList<Track> by mutableStateOf(mutableListOf())

@ExperimentalFoundationApi
@Composable
private fun ResultList(model: FreezerModel) {
    with(model) {
        if (favourites.isEmpty()) NoDataMessage("No favourites yet")
        else {
            LazyColumn(state = rememberLazyListState()) {
                items(favourites) {
                    TrackCard(it, model)
                }
            }
        }
    }
}

关于点击事件，我正在更新我的收藏夹列表（添加/删除项目）。我怎样才能让我的可组合立即反映这些变化（比如重新绘制自己或类似的东西）？到目前为止，它只在我第一次切换到另一个屏幕时有效。

感谢您的投入！

Answer 1

您需要使用 MutableStateList<T> 以便 Compose 可以在状态更改时自动重新编写。

来自official doc：

<块引用>

注意：在 Compose 中使用可变对象（例如 ArrayList<T> 或 mutableListOf()）作为状态会导致您的用户在您的应用中看到不正确或过时的数据。

在你的代码中使用

val favourites by mutableStateListOf<Track>()

代替

var favourites: MutableList<Track> by mutableStateOf(mutableListOf())

Answer 2

只需从 state = rememberLazyListState() 参数列表中删除 lazyColumnFor 应该适用于您的情况。

根据文档，如果我们使用 rememberLazyListState() 然后 :-

<块引用>

对提供的初始值的更改不会导致重新创建或以任何方式更改状态（如果已经创建）。

这样做之后，通常更新列表应该可以正常工作。向可组合对象公开不可变列表 ( list ) 而不是 mutableList 也是一种很好的做法。

例如使用：-

var favourites by mutableStateOf(listOf<FavoriteItem>())

然后使用 add/remove/update 列表：-

favourites = favourites + newList // add 
favourites = favourites.toMutableList().also { it.remove(item) } // remove

Jetpack Compose：列表更改时更新可组合

2 个答案: