react-promise-suspense

KO | EN

gitlite — search

#python #hacktoberfest #ai #android #machine-learning #deep-learning #linux #docker #nodejs #macos #cli #security #openai #open-source

react-promise-suspense

(★ 163)

A React hook for resolving promises with Suspense support. <1kb bundle.

File Explorer

Download Latest Version (.zip)

- - favicon.ico
  - index.html
  - logo192.png
  - logo512.png
  - manifest.json
  - robots.txt
- - App.css
  - App.test.tsx
  - App.tsx
  - index.css
  - index.tsx
  - logo.svg
  - react-app-env.d.ts
  - reportWebVitals.ts
  - setupTests.ts
- .gitignore
- package-lock.json
- package.json
- README.md
- tsconfig.json
- yalc.lock
- index.ts
.gitignore
.npmignore
LICENSE
package-lock.json
package.json
README.md
tsconfig.json

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# usePromise

React hook for resolving promises with Suspense support.

Inspired by [fetch-suspense](https://github.com/CharlesStover/fetch-suspense), but this one is not limited to fetch, `usePromise` works with any Promise.

[![version](https://img.shields.io/npm/v/react-promise-suspense.svg)](https://www.npmjs.com/package/react-promise-suspense)
[![minified size](https://img.shields.io/bundlephobia/min/react-promise-suspense.svg)](https://www.npmjs.com/package/react-promise-suspense)
[![minzipped size](https://img.shields.io/bundlephobia/minzip/react-promise-suspense.svg)](https://www.npmjs.com/package/react-promise-suspense)
[![downloads](https://img.shields.io/npm/dt/react-promise-suspense.svg)](https://www.npmjs.com/package/react-promise-suspense)

## Install

* `npm install react-promise-suspense --save`

## Example

- Here's an [Codesandbox example](https://codesandbox.io/s/react-promise-suspense-example-t14mh) of a setTimeout delayed component.

- Awaiting a fetch promise:
```js
import usePromise from 'react-promise-suspense';

const fetchJson = input => fetch(input).then(res => res.json());

const MyFetchingComponent = () => {
  // usePromise(Promise, [inputs,],)
  const data = usePromise(fetchJson, [
    'https://pokeapi.co/api/v2/pokemon/ditto/',
    { method: 'GET' },
  ]);

return <pre>{JSON.stringify(data, null, 2)}</pre>;
};

const App = () => {
  return (
    <Suspense fallback="Loading...">
      <MyFetchingComponent />
    </Suspense>
  );
};
```

react-promise-suspense

File Explorer

Today's picks

Was this content helpful?

Recent Feedback

react-promise-suspense

File Explorer

Today's picks

Was this content helpful?

Recent Feedback

Download README