Simple Reactjs Component for Rendering Data with Loading, Failure

react-data-wrapper

Simple ReactJS component for rendering data with loading, failure & empty states.

Note: required React v16.9+

Usage

import DataWrapper from 'react-data-wrapper';

<DataWrapper
  fetchFunc={store.fetch}
  isEmpty={store.empty}
  loading={<div>Loading posts...</div>}
  failure={<ErrorLoading />}
  empty={<div>No data</div>}
>
  <PostsList posts={store.posts} />
</DataWrapper>

Note: ErrorLoading should have onReloadClick: () => Promise<void> prop.

📝 Example code

Install

npm i -S react-data-wrapper

Download Details:

Author: SanichKotikov

Source Code: https://github.com/SanichKotikov/react-data-wrapper

#reactjs #react #javascript