HOC (Higher Order Component) Loader for Redux Containers
yarn add react-native-hoc-loader
or
npm install react-native-hoc-loader
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.
import { connect } from 'react-redux';
import HOCLoader from 'react-native-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));
...Discover the release history by heading on over to the releases page.
Unless stated otherwise all works are:
- Copyright © 2018+ Reme Le Hane
and licensed under: