自定义react组件,Img,图片获取失败时能显示指定的默认图片。
import React from 'react';
import ReactDOM from 'react-dom';
/**
* 图片加载失败就显示默认图片
*/
class Img extends React.Component {
constructor(props) {
super(props);
this.state = {
imageUrl: this.props.imageUrl
};
}
handleImageLoaded() {
}
handleImageErrored() {
this.setState({
imageUrl: this.props.defaultImg
});
}
render() {
return (
<img style={this.props.style}
src={this.state.imageUrl}
onLoad={this.handleImageLoaded.bind(this)}
onError={this.handleImageErrored.bind(this)}
/>
);
}
}
export default Img;