Javascript <；图片/>；元素onLoad不是持续触发的

关于image

onLoad

的问题由于某种原因没有触发，所以我在图片和图像上都有onLoad，但有时它们都触发，但其他时候它们都没有触发

  return <picture onLoad={() => console.log('loaded')} className={className}>
    {Array.isArray(sources) && sources.map((d, i) => <source key={`${i}${d.srcSet}`} srcSet={d.srcSet} media={d.media} />)}
    <img src={src} onLoad={() => console.log('img loaded')} alt={alt} />
  </picture>

return console.log（'loaded'）}className={className}>
{Array.isArray（sources）&&sources.map（（d，i）=>）}
console.log（'img loaded'）}alt={alt}/>

我在这里做错了什么？检测图片元素的图像加载的正确方法是什么

是否应在

img

或

picture

上加载

onLoad

---

非常感谢

图像加载完成后将触发图像标签onload。如果您想了解图像下载的进度，请使用

onprogress={(e) => { 
   console.log(e); 
   console.log((e.loaded / e.total) * 100);
}}

---

使用此选项，您可以计算并显示图像加载的进度。

如果这是您要查找的答案，请将其标记为已回答。我不知道这是如何被接受为答案的，OP没有要求进度。OP问了一些完全无关的问题。