preload-component

preload-component React component

Usage no npm install needed!

<script type="module">
  import preloadComponent from 'https://cdn.skypack.dev/preload-component';
</script>

README

preload-component

Travis npm package Coveralls

Preload images the react way

Install

$ npm install preload-component --save

Usage

import Preload from 'preload-component'

..

render () {
  return (
    <Preload
      images={[img1, img2]}
      onLoad={() => console.log('images loaded!')}
    >
      {hasLoaded => hasLoaded ? <Fragment><img src={img1} /> <img src={img2} /></Fragment> : null}
    </Preload>
  )
}

API

Param Type functionality required
images Array Array of urls you want to preload true
children Function render function taking the image array load state true
onLoad Function Notify consuming component when images are loaded false

License

MIT © Jack Hanford