Wondering what’s next for npm?Check out our public roadmap! »

    react-image-loader-hoc

    1.1.1 • Public • Published

    React Image Loader HOC

    Version React Downloads License

    React-Image-Loader-HOC is a High Order Component that allows you to enhance your React Image Component by adding features to handle the loading of the image source in an elegant way.

    Features

    • Super easy to use.
    • Customizable - Provided props to make it custom for your project.

    Installation

    $ yarn add react-image-loader-hoc
    or
    $ npm install --save react-image-loader-hoc
    

    Usage

    import React, { Component } from 'react';
    import withImageLoader from 'react-image-loader-hoc';
    
    const Image = props => (<img alt="" {...props} />);
    const ImageWithLoader = withImageLoader(Image);
    
    class App extends Component {
      render() {
        return (
            <div>
              <ImageWithLoader
                src="https://edmullen.net/test/rc.jpg"
                width="400px"
                height="200px"
              />
            </div>
        );
      }
    }
    

    Props

    Prop Type Required Description Default
    src String Yes Image url -
    onLoad Function No Callback when load is successful -
    onError Function No Callback when load fails -
    loaderComp Component No Custom React component to be displayed while loading -
    errorComp Component No Custom React component to be displayed on Error -
    fadeIn Boolean No Load the image with Fade In effect True

    Demo

    You want to see some examples? Go to Online Demo

    Install

    npm i react-image-loader-hoc

    DownloadsWeekly Downloads

    67

    Version

    1.1.1

    License

    MIT

    Unpacked Size

    171 kB

    Total Files

    4

    Last publish

    Collaborators

    • avatar