Background-Image-On-Load
A simple way to checkbackground-image is loaded.
Installation
npm:
npminstallbackground-image-on-load--saveyarn:
yarn add background-image-on-loadUsage
importReact,{Component}from'react';importBackgroundImageOnLoadfrom'background-image-on-load';classAppextendsComponent{state={bgIsLoaded:false};render(){const{bgIsLoaded}=this.state;return(<divstyle={{height:300,backgroundPosition:'center',backgroundSize:'cover',backgroundImage:`url(${!bgIsLoaded?'https://picsum.photos/310/310?blur':'https://picsum.photos/1600/310'})`}}><BackgroundImageOnLoadsrc={'https://unsplash.it/1200/310?random'}onLoadBg={()=>this.setState({bgIsLoaded:true})}onError={err=>console.log('error',err)}/></div>);}}exportdefaultApp;If you like this library please click on the start button on github.
Top comments(3)
Subscribe
For further actions, you may consider blocking this person and/orreporting abuse
