Skip to content

Commit edb8913

Browse files
committed
Add useAsync to README.
1 parent 4168f2b commit edb8913

File tree

1 file changed

+26
-4
lines changed

1 file changed

+26
-4
lines changed

README.md

Lines changed: 26 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -31,13 +31,13 @@
3131
</a>
3232
</p>
3333

34-
React component for declarative promise resolution and data fetching. Leverages the Render Props pattern for ultimate
35-
flexibility as well as the new Context API for ease of use. Makes it easy to handle loading and error states, without
36-
assumptions about the shape of your data or the type of request.
34+
React component for declarative promise resolution and data fetching. Leverages the Render Props pattern and Hooks for
35+
ultimate flexibility as well as the new Context API for ease of use. Makes it easy to handle loading and error states,
36+
without assumptions about the shape of your data or the type of request.
3737

3838
- Zero dependencies
3939
- Works with any (native) promise
40-
- Choose between Render Props and Context-based helper components
40+
- Choose between Render Props, Context-based helper components or the `useAsync` hook
4141
- Provides convenient `isLoading`, `startedAt` and `finishedAt` metadata
4242
- Provides `cancel` and `reload` actions
4343
- Automatic re-run using `watch` prop
@@ -71,6 +71,28 @@ npm install --save react-async
7171

7272
## Usage
7373

74+
As a hook with `useAsync`:
75+
76+
```js
77+
import { useAsync } from "react-async"
78+
79+
const loadJson = () => fetch("/some/url").then(res => res.json())
80+
81+
const MyComponent = () => {
82+
const { data, error, isLoading } = useAsync({ promiseFn: loadJson })
83+
if (isLoading) return "Loading..."
84+
if (error) return `Something went wrong: ${error.message}`
85+
if (data)
86+
return (
87+
<div>
88+
<strong>Loaded some data:</strong>
89+
<pre>{JSON.stringify(data, null, 2)}</pre>
90+
</div>
91+
)
92+
return null
93+
}
94+
```
95+
7496
Using render props for ultimate flexibility:
7597

7698
```js

0 commit comments

Comments
 (0)