use-suspense-hooks

Hooks that allow synchronous execution of Async functions via React.Suspension

📦 Install

$ npm install use-suspense-hooks

$ yarn add use-suspense-hooks

📔 Usage

// This component is loaded dynamically
const OtherComponent: React.FC = () => {
  const result = useSuspenseValue(`unique-key`, async () => {
    // Asynchronous processing such as data fetching
    return await asyncFunction()
  })
  
  return (
    <div>{result}</div>
  )
}

function MyComponent() {
  return (
      // Displays <Spinner> until OtherComponent loads
      <React.Suspense fallback={<Spinner />}>
        <div>
          <OtherComponent />
        </div>
      </React.Suspense>
  );
}

🤝 Contributing

1. Fork it ( https://github.com/sskmy1024y/use-suspense-hooks/fork )
2. Create your feature branch (git checkout -b my-new-feature)
3. Commit your changes (git commit -am 'Add some feature')
4. Push to the branch (git push origin my-new-feature)
5. Create a new Pull Request

🎫 Licence

The MIT License (MIT)

• Copyright (c) 2022 sskmy1024y

🖋 Author

• sskmy1024y