Skip to content
HOC (Higher Order Component) Loader for Redux Containers
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
src
.editorconfig
.gitignore
.npmignore
.vcmrc
LICENSE
README.md
dev.env
package.json
prod.env
projectz.cson
tsconfig.json
tslint.json
webpack.config.js
yarn.lock

README.md

React HOC Loader

HOC (Higher Order Component) Loader for Redux Containers

Nodei.co badge
Travis CI Build Status NPM version NPM downloads Dependency Status

Installation

yarn add react-hoc-loader

or

npm install react-hoc-loader

Usage

Component sits within the container and fires off a function in a similar way to which componentWillMount would.

An optional loading indicator can be passed from a state key to determine if a loading indicator should be displayed before rendering the intended component.

If there is no component, but you would like to display a simple text message, then pass undefined as the 4th argument and a string message as the 5th.

Example:

import { connect } from 'react-redux';
import HOCLoader from 'react-hoc-loader';
import LoadingScreen from './loading-screen';
import Component from './components';

const mapStateToProps = ({ reducer }) => ({
  // State key to determine if a load is in progress
  isLoading: reducer.isLoading
});

export const mapDispatchToProps = dispatch => ({
  onLoad() {
    // Function to fire off when container first loads
    dispatch({ type: 'LOADING_DATA' });
  },
});

...
const Container = connect(
  mapStateToProps,
  mapDispatchToProps,
)(HOCLoader(Component, 'onLoad', 'isLoading', LoadingScreen));

...

History

Discover the release history by heading on over to the releases page.

License

Unless stated otherwise all works are:

  • Copyright © 2018+ Reme Le Hane

and licensed under:

You can’t perform that action at this time.