<template>
  <ImageLoader
    errorImageSrc="https://example.com/image_1"
    imageSrc="https://example.com/image_2"
    alt="Alternate Text"
  >
    <!-- Add Your Cusom Loader Here -->
    <Loader />

  </ImageLoader>
</template>
<script>
import ImageLoader from "vue-image-loading";
import Loader from "@/components/Loader";
export default {
  name: "App",
  components: { ImageLoader, Loader },
};
</script>

Props

Prop Name	Description	Type
imageSrc	`scr` Attribute For Image To Load	string
errorImageSrc	`scr` Attribute For Image To Load When Main Image Cause Error	string
alt	`alt` Attribute For Image	string

Customize Style

.image-container{  /* Root Element */  }

.image-container img{  /* Your Image Element */  }

.image-container .image-container-overlay{ /* Loader Overlay Element */   }

Report an issue if you find there's something wrong

Keywords

image image-loading Loader vue