way of retrieving dimensions
You can achieve your goal just by js: through offsetHeight, offsetWidth.
In order to get the img’s dimensions, img must be visible. You can’t get dimensions from a cached img.
example: https://jsbin.com/jibujocawi/1/edit?js,output
class AtomicImage extends Component {
constructor(props) {
super(props);
this.state = {dimensions: {}};
this.onImgLoad = this.onImgLoad.bind(this);
}
onImgLoad({target:img}) {
this.setState({dimensions:{height:img.offsetHeight,
width:img.offsetWidth}});
}
render(){
const {src} = this.props;
const {width, height} = this.state.dimensions;
return (<div>
dimensions width{width}, height{height}
<img onLoad={this.onImgLoad} src={src}/>
</div>
);
}
}