Skip to content

React component that forcefully suspends the the component tree.

Notifications You must be signed in to change notification settings

kanitsharma/react-suspender

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

13 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

react-suspender

React component that forcefully suspends the component tree.

NPM JavaScript Style Guide

Install

npm install --save react-suspender

Usage

import React, { Component, Suspense } from 'react'

import Suspender from 'react-suspender'

class SuspendExample extends Component {
  render () {
    return (
      <Suspense fallback={<div>Suspended</div>}>
        <Suspender />
      </Suspense>
    )
  }
}

Another example, you can suspend your component tree while data fetching.

import React, { Component, Suspense } from 'react'

import Suspend from 'react-suspender'

function SuspendExample () {
  const [ dataLoaded, setDataLoaded ] = React.useState(false);

  // Fetch Data
  React.useEffect(() => {
    const timer = setTimeout(() => {
      setDataLoaded(true);
    }, 1000);

    return () => clearTimeout(timer);
  });

  return (
    <Suspense fallback={<div>Loading...</div>}>
      <Suspender suspend={!dataLoaded} >
        API data loaded !!!
      </Suspender>
    </Suspense>
  )
}

Props

  • suspend : bool

License

MIT © kanitsharma

About

React component that forcefully suspends the the component tree.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published