Question

我的情况很奇怪，无法以某种方式解决它。

*.exe

我正在使用上述功能处理图像错误，并在出现错误的情况下为图像提供了另一个来源（factory.svg）和尺寸。我遇到的情况是图像加载，并且还具有errorHandler给出的宽度和高度。我认为它无法首次加载图像，然后onError触发并更改尺寸，最后，它成功加载。如果最后加载，那么我不想在图像上显示宽度和高度。 src示例为 https://logo.clearbit.com/op.fi?size=20 。问题在于，当它从传入的源中加载图像时，已经绑定了他的尺寸，但是当errorHandler触发时，它会覆盖图像尺寸并为其赋予const handleImageError = e => { e.target.onerror = null; e.target.src = 'factory2.svg'; e.target.width = 45; e.target.height = 41; }; items.map(item => { if(item.data) { <img src={`${item.data}?size=20`} onError={handleImageError} /> } else { <Logo styleName="defaultIconLogo" width={25} height={20} /> } })和width='45'。当源网址不起作用时，我只需要将此尺寸赋予图片

Answer 1

再次验证您的代码，我认为您的代码中遗漏了一些东西

const handleImageError = e => {
    e.target.onerror = null;
    e.target.src = 'factory2.svg';
    e.target.width = 45;
    e.target.height = 41;
};

items.map(item => {
   if(item.data) {
// the image source is like path of the image right here you are assigning size value  
       <img src={`${item.data}?size=20`} onError={handleImageError} />
//here your are using conditional statement right where you close properly the conditional statement should be like condition==true?true:false
   } else {
       <Logo styleName="defaultIconLogo" width={25} height={20} />
   }

})

onError事件的行为不符合预期

1 个答案: