Skip to content

Instantly share code, notes, and snippets.

@DrewDahlman
Created July 22, 2019 18:35
Show Gist options
  • Save DrewDahlman/46b8fee42dd35226d435556e32b06491 to your computer and use it in GitHub Desktop.
Save DrewDahlman/46b8fee42dd35226d435556e32b06491 to your computer and use it in GitHub Desktop.
class ImageBlock extends React.PureComponent {
state = {
loaded: false
};
componentDidMount() {
this.ref.addEventListener("load", this.onLoad);
}
onLoad = () => {
this.setState({
loaded: true
});
// If this component is part of a webGL element add the image
if (this.props.addImage) {
this.props.addImage(this.ref);
}
};
render() {
const { title, url, copy } = this.props.data;
const { loaded } = this.state;
return (
<div className={css("content-block", loaded && "loaded")}>
<img
src={`${url}`}
width="100%"
ref={r => {
this.ref = r;
}}
/>
<Headline copy={title} />
{copy != "" && <p>{copy}</p>}
</div>
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment