1.0.0 • Published 3 years ago
vue-image-loading2 v1.0.0
vue-image-loading
simple Vue Component To Display Loader untill Image Loaded Scuccessfully, And Show Error Image When Target Image Cause Error
Screenshots
Installation
npm install vue-image-loading --save
Example Usage
<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
1.0.0
3 years ago