我正在尝试找到一个不使用 jQuery 的更现代的解决方案，因为我正在使用 React(特别是 Gatsbyjs)。
我有一个网站，其中包含多个包含高分辨率图像的图像轮播。
问题是每个图像轮播一次只显示一张图像，因此只有当用户导航到下一张图像时才会获取图像，这会导致加载外观不稳定。
我尝试过使用 onLoad 和 load 事件监听器进行在线研究，但到目前为止似乎都不起作用，因为它们只加载轮播当前显示的图像，而不是轮播中的所有图像。
如果有一种方法可以先加载所有图像，然后将状态设置为 true，只有在状态为 true 后，剩下的 DOM 才会出现在屏幕上，那就完美了。
有什么建议吗？谢谢。
最佳答案
正如 Lonnie Best 所说，我最终使用 Promise.all() 来捕获图像的负载。
以防万一其他人想查看: https://codesandbox.io/s/react-image-preload-ptosn
关于javascript - 如何在 React 中显示页面之前加载所有图像？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/60847095/