https://github.com/joeshub/react-use-image
React hook to preload an image
https://github.com/joeshub/react-use-image
hook hooks image img preload-images react react-use
Last synced: 7 months ago
JSON representation
React hook to preload an image
- Host: GitHub
- URL: https://github.com/joeshub/react-use-image
- Owner: joeshub
- License: mit
- Created: 2020-06-18T17:56:10.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2023-01-26T21:49:54.000Z (over 2 years ago)
- Last Synced: 2025-02-14T09:30:44.286Z (8 months ago)
- Topics: hook, hooks, image, img, preload-images, react, react-use
- Language: TypeScript
- Homepage:
- Size: 1.25 MB
- Stars: 2
- Watchers: 2
- Forks: 0
- Open Issues: 33
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# react-use-image
A react hook for pre-loading images.
## install it
```bash
npm i react-use-image
# or
yarn add react-use-image
```
## use it
```jsx
import useImage from 'react-use-image';
const Example = ({ src }) => {
// use the hook
// pass it an image source url
const { loaded } = useImage(src);
if (!loaded) return null;
return 
;
};
```
## input
Image URL, e.g.
## return values
```js
{
"loaded": false, // image found and loaded
"failed": false, // image not found
// actual size of the image
"dimensions": {
"width": 0, // width of image in pixels
"height": 0 // height of image in pixels
}
}
```
## Docs
- Storybook coming soon
## Authoer
Joe Seifi
## Licence
MIT