React中的异步图片库

时间:2018-11-13 01:35:25

标签: reactjs image image-gallery

我正在创建一个反应图库。我将所有图像的缩略图加载到一页上,使用map()渲染存储在初始状态的图像数组。 我想做的是将图像缩略图一张一张地加载(一旦第一次加载淡入),然后再与第二张缩略图一样加载,就像多米诺骨牌效果。解决该问题的最佳方法是什么? 我试图映射数组并在img标签上设置onload,但是一旦全部加载,它就会立即淡入所有图像。

1 个答案:

答案 0 :(得分:0)

如果要在加载图像后立即淡入图像,则不会获得所需的多米诺骨牌效果,因为将在不同的时间加载图像。例如,也许图像4首先淡入淡出,然后是图像6,然后淡入图像1,或者也许所有图像都一次加载并同时淡入。

我建议所有图像加载完毕后,淡入图像#1,延迟1秒,淡入图像#2,延迟1秒,淡入图像#3,以获得Domino效果。

相关问题