从相册中延迟加载图像答案

【问题标题】：Lazy loading images from album从相册中延迟加载图像
【发布时间】：2022-11-22 22:24:40
【问题描述】：

我对 react-native 还很陌生，遇到了一些问题。我正在尝试使用 community/cameraroll": Version "^1.8.1" 在平面列表中加载图像。函数“fAlbumImage”获取相册中的前 100 个。 `

const IMAGE_FETCH_COUNT = 100
const fAlbumImage = async (group_name, nextAlbum) => {
  console.log("Album hit me")
  try {
    const albumImages = await CameraRoll.getPhotos({
      after: nextAlbum !== '' ? nextAlbum : undefined,
      first: IMAGE_FETCH_COUNT,
      assetType: 'Photos',
      groupTypes: 'All',
      groupName: group_name
    })
    return {
      images: albumImages.edges,
      pagingAlbum: {
        nextAlbum: albumImages.page_info.has_next_page
          ? albumImages.page_info.end_cursor
          : '',
      },
    }
  } catch (err) {
    console.log("No images found in album")
  }

}

Ideally, I would like to get the rest of the album, Am I doing this the right way

const getAlbumLocalId = async (group_name) => {
    //gets 100 images that have the same group name as the one that has been pressed
    const { images: AlbumIm = [], paging = {} } = await fetchImages("", "", "", group_name)
    setNextAlbum(paging.nextAlbum)
    console.log("nextAlbum", nextAlbum)
    setLoading(false)
    //group name is the variable you create but is getting what is being passed
    setSelectedAlbumImages(selectedAlbumImages => {
      return photo.filter((obj) => obj.node.group_name == group_name).map((obj) => {
        return obj
      })
    })
    setPhoto([...AlbumIm])
    setSelectedAlbumImages([...AlbumIm])
    setPhotoInAlbum(true)
    setLocalCoverImages(true)
  }

` 任何帮助都会得到认可 :) 非常感谢

我想一次获取 100 张图像，直到我们收到相册中的所有图像以优化加载。

【问题讨论】：

标签： react-native

【解决方案1】：

为什么要延迟加载照片？延迟加载会延迟立即加载网页上不再需要的照片。网页加载时用户不再看到的图像会在用户滚动时加载，图片完全变为可见。

【讨论】：