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

Question

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

ViewModel

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

HomeView

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

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

您应该将其设置为 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))
                    }
                }
            }
        }
    }
}