react-auto-height-image

react-auto-height-image

Avoid zero height when loading image

Example: use my package on the left side

Install

yarn add react-auto-height-image
#or
npm install react-auto-height-image

Use

Use with your loading component

<AutoHeightImage
  src="https://i.picsum.photos/id/172/200/300.jpg"
  loadingComponent={<LoadingComponent />}
/>

Use with fixed height

<AutoHeightImage
  src="https://i.picsum.photos/id/172/200/300.jpg"
  defaultHeight="200px"
/>

Props

interface AutoHeightImageProps extends React.ImgHTMLAttributes<HTMLImageElement> {
  loadingComponent?: React.ReactNode,
  defaultHeight?: string,
}