【发布时间】：2020-12-10 01:38:19
【问题描述】：
我有一个简单的标签<img url="myurl.com/123"/>。现在，我使用 react 每秒用随机 URL 生成它们，并且它总是替换最后一个。我注意到连接速度较慢时，图像将开始加载，但即使我替换当前标签也不会停止。相反，他们将下载图片并且不对其进行任何操作。我想要发生的是，当带有此图像的标签消失时，图像停止加载，而是下一个开始。有什么好的方法吗？我知道有 load="lazy" 属性，但这只会阻止加载不在屏幕上的图像，实际上不会取消它。
【问题讨论】：
-
你的代码是什么？
-
在内存中创建图像，然后附加到 HTML。 css-tricks.com/pre-caching-image-with-react-suspense
-
我不相信您可以控制一旦开始检索图像资源的过程。但这感觉就像您正在尝试解决真正的问题：如果加载图像的时间比在屏幕上显示的时间长，那么您需要大幅减小图像尺寸，或者显示图像的时间更长。取消以前的图片并不能解决问题，充其量只能阻止它随着时间的推移而变得更糟。