lazy-image-vue3 with Vue3.

Navigation

• Features
• Installation
• Usage

Features

• used vue3

• easy to install

Installation

     npm install --save lazy-image-vue3

Usage

#default

<template>
  <div
    style="height: 500px"
    v-for="(item, i) in items"
    :key="i"
  >
    <LazyImageVue3 :picture="item.img"/>
  </div>
</template>

import LazyImageVue3 from 'lazy-image-vue3'

components: {
    LazyImageVue3
  },
data: () => ({
items: [
   {
    img: 'https://cdn-images-1.medium.com/max/800/1*xjGrvQSXvj72W4zD6IWzfg.jpeg'
   },
   {
    img: 'https://cdn-images-1.medium.com/max/800/1*xjGrvQSXvj72W4zD6IWzfg.jpeg'
   },
  {
    img: 'https://cdn-images-1.medium.com/max/800/1*xjGrvQSXvj72W4zD6IWzfg.jpeg'
  },
  {
    img: 'https://cdn-images-1.medium.com/max/800/1*xjGrvQSXvj72W4zD6IWzfg.jpeg'
  },
  {
    img: 'https://cdn-images-1.medium.com/max/800/1*xjGrvQSXvj72W4zD6IWzfg.jpeg'
  },
  {
    img: 'https://cdn-images-1.medium.com/max/800/1*xjGrvQSXvj72W4zD6IWzfg.jpeg'
  },
  {
    img: 'https://cdn-images-1.medium.com/max/800/1*xjGrvQSXvj72W4zD6IWzfg.jpeg'
  }
	]
  }),

Check that the component is working properly. Open the console and watch the addition of LazyImageVue3-isShown = true

#Donate (creating code at your request out of turn) I would be very grateful for the star on github.com)))

💰 I can do some feature for you out of turn and at a fast pace or solve your problem, give a quick answers. To do this, you can pay me one-time or make a subscription. We can discuss the details by email, it is written in my profile.