placeholder image when loading

This commit is contained in:
MathieuG-P
2022-06-28 20:29:55 +02:00
parent 3987aceef5
commit 633a7d68cf
2 changed files with 4 additions and 4 deletions
@@ -1,6 +1,6 @@
export function BsmImage({className, image, errorImage, loading}: {className?: string, image: string, errorImage?: string, loading?: "lazy"|"eager"}) {
export function BsmImage({className, image, errorImage, placeholder, loading}: {className?: string, image: string, errorImage?: string, placeholder?: string, loading?: "lazy"|"eager"}) {
return (
<img className={className} src={image} loading={loading} onError={({currentTarget}) => { currentTarget.onerror = null; currentTarget.src = errorImage ? errorImage : "" }}/>
<img className={className} src={image} loading={loading} onError={({currentTarget}) => { currentTarget.onerror = null; currentTarget.src = errorImage ? errorImage : "" }} style={{backgroundImage: `url(${placeholder})`, backgroundSize: "cover"}}/>
)
}