自定义react组件:Img,图片获取失败时能显示指定的默认图片
2017-07-14 17:56
2707 查看
自定义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;
相关文章推荐
- img 加载网络图片失败 显示默认图片的方法
- React Js img 图片显示默认 占位符
- img 加载网络图片失败 显示默认图片
- 使用jquery给加载失败的img元素显示默认图片
- JS处理img标签加载图片失败,显示默认图片
- js处理img标签加载图片失败,显示默认图片
- html 加载图片失败显示默认图片
- ionic 图片加载失败,显示默认图片代替
- ListView item中的 RadioButton(自定义RadioButton图标,默认无图,选择有图)点击时不显示图片问题
- iOS7修改UITabBar文本颜色以及解决自定义选中图片显示为默认蓝色的问题
- iOS7 UITabBar自定义选中图片显示为默认蓝色的Bug
- 图片加载失败,显示默认图片
- 微信小程序image组件binderror使用例子(对应html、js中的onerror) ,图片失效显示默认图片
- 加载图片失败后显示系统默认图片
- iOS7 UITabBar自定义选中图片显示为默认蓝色的Bug
- 指定img标签默认图片的方法
- 当图片加载失败或者没有的情况下显示默认图片
- react-native-swiper在滚动视图中默认不显示图片的问题
- 如果图片加载失败,显示默认图片
- HTML基础 img标签alt属性 当图片加载失败的时候显示为文本