在我的create-react-app中,我有显示服务器端图像的卡,并且当不返回服务器端图像时,我想使用虚拟图像。似乎“ onError”事件从未触发。这是我的代码:

import React from 'react';
import notfound from '../../icons/notfound.png';

class Card extends React.Component {
constructor(props) {
    super(props);
    this.state = {
        open: false
    }
}

addDefaultSrc(ev){
    ev.target.src = {notfound};
    ev.target.onerror = null;
}

render(){
    return (
        <div>
           <div><img className="item-photo" onError={() => this.addDefaultSrc} src={url} alt=""></img>
           </div>
        </div>
    );
}


和卡片列表

    return (
         <Card
             key={i}
             id={item.No}
             url={`http://***.***.*.*:3000/${item.No}.JPG`}
         />


尽管没有图像可显示时出现404错误(未找到),但不会触发onError事件。任何帮助将非常感激。

最佳答案

您实际上并不是在调用该函数。请尝试以下两个选项之一:

onError={this.addDefaultSrc}onError={(e) => this.addDefaultSrc(e)}

关于javascript - React img onError事件未触发,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/54979755/

10-12 07:06