useImage

Category

Browser

Hook that load an image in the browser

import { useImage } from '@siberiacancode/reactuse';

Usage

const { data, isLoading, isError, isSuccess, error, refetch, isRefetching } = useImage('https://example.com/image.png');

Demo

source

Api

Parameters

Name	Type	Default	Note
src	string	-	The source of the image
options.srcset?	string	-	The srcset of the image
options.sizes?	string	-	The sizes of the image
options.alt?	string	-	The alt of the image
options.class?	string	-	The class of the image
options.loading?	HTMLImageElement['loading']	-	The loading of the image
options.crossorigin?	string	-	The crossorigin of the image
options.referrerPolicy?	HTMLImageElement['referrerPolicy']	-	The referrerPolicy of the image
useQueryOptions.keys?	DependencyList	-	The dependencies for the hook
useQueryOptions.onSuccess?	(data: Data) => void	-	The callback function to be invoked on success
useQueryOptions.onError?	(error: Error) => void	-	The callback function to be invoked on error
useQueryOptions.refetchInterval?	number	-	The refetch interval
useQueryOptions.retry?	boolean | number	-	The retry count of requests

Returns

UseImageReturn

Contributors

Source • Demo