在 jetpack 撰写导航中返回导航时分页 3 列表自动刷新

Question

我正在使用 Jetpack Compose，以及 Paging 3 库和 Jetpack Navigation。我面临的问题是我有一个 LazyList，它使用分页库从远程源获取数据。

视图模型

fun getImages(): Flow<PagingData<ObjectImage>> = Pager(
        PagingConfig(PAGE_SIZE, enablePlaceholders = false)
    ) { DataHome(RANDOM) }.flow.cachedIn(viewModelScope)

主页视图

val images = viewModelHome.getImages().collectAsLazyPagingItems()
LazyColumn {
  ...
}

现在发生的情况是，当我使用导航到另一个视图navHostController.navigate()，然后按返回返回到 HomeView 时...LazyColumn 会重置自身并开始再次从网络加载项目。

所以我被这个问题困扰了。我尝试在 viewModel 变量中手动缓存...虽然它有效，但它搞砸了 SwipeRefresh （停止显示刷新状态）

data.apply {
            when {
                // refresh
                loadState.refresh is LoadState.Loading -> {
                    ItemLoading()
                }

                // reload
                loadState.append is LoadState.Loading -> {...}

                // refresh error
                loadState.refresh is LoadState.Error -> {...}

                // reload error
                loadState.append is LoadState.Error -> {...}
            }
        }

implementation("androidx.paging:paging-runtime-ktx:3.1.0")
implementation("androidx.paging:paging-compose:1.0.0-alpha14")

这是仍处于 alpha 阶段的 PagingLibrary 的问题吗？

更新1（我不确定这是否是一个好的解决方案，但我正在解决滑动刷新问题，如下）

// get images
    var images: Flow<PagingData<ObjectImage>> = Pager(PagingConfig(PAGE_SIZE)) {
        DataHome(RANDOM)
    }.flow.cachedIn(viewModelScope)

    // reload items
    fun reload(){
        images = Pager(PagingConfig(PAGE_SIZE)) {
            DataHome(RANDOM)
        }.flow.cachedIn(viewModelScope)
    }

// and rather than calling .refresh() method on lazy items... I am calling viewModel.reload()

Answer 1

问题是您Pager每次调用时都会创建新的getImages()，即每次您的可组合项重新组合时，这不是应该如何完成的。

您应该将其设置val items = Pager(...为缓存才能正常工作。

对于搞砸的SwipeRefresh，你如何实施它？上有一个refresh()方法LazyPagingItems，你应该使用它。

编辑：好的，根据对您问题的评论和编辑：

在您的视图模型中，按照我之前的建议进行操作：

val items = Pager( // define your pager here

您的可组合项可以如下所示：

@Composable
fun Screen() {
    val items = viewModel.items.collectAsLazyPagingItems()
    val state = rememberSwipeRefreshState(
        isRefreshing = items.loadState.refresh is LoadState.Loading,
    )

    SwipeRefresh(
        modifier = Modifier.fillMaxSize(),
        state = state,
        // use the provided LazyPagingItems.refresh() method,
        // no need for custom solutions
        onRefresh = { items.refresh() }
    ) {
        LazyColumn(
            modifier = Modifier.fillMaxSize(),
        ) {
            // display the items only when loadState.refresh is not loading,
            // as you wish
            if (items.loadState.refresh is LoadState.NotLoading) {
                items(items) {
                    if (it != null) {
                        Text(
                            modifier = Modifier.padding(16.dp),
                            text = it,
                        )
                    }
                }
                // you can also add item for LoadState.Error, anything you want
                if (items.loadState.append is LoadState.Loading) {
                    item {
                        Box(modifier = Modifier.fillMaxWidth()) {
                            CircularProgressIndicator(
                                modifier = Modifier
                                    .align(Alignment.Center)
                                    .padding(16.dp)
                            )
                        }
                    }
                }
            }
            // if the loadState.refresh is Loading,
            // display just single loading item,
            // or nothing at all (SwipeRefresh already indicates
            // refresh is in progress)
            else if (items.loadState.refresh is LoadState.Loading) {
                item {
                    Box(modifier = Modifier.fillParentMaxSize()) {
                        Text(
                            text = "Refreshing",
                            modifier = Modifier.align(Alignment.Center))
                    }
                }
            }
        }
    }
}