在Vue中实现图片懒加载可以通过多种方式，其中使用vue-lazyload插件是一种流行且高效的方法。以下是使用vue-lazyload插件实现图片懒加载的基本步骤：

1. 安装vue-lazyload插件：首先，需要通过npm安装vue-lazyload插件。可以在项目的根目录下运行以下命令来安装：

   npm install vue-lazyload --save
   

   这一步会将vue-lazyload添加到项目的依赖中[3][5]。

2. 在Vue项目中引入并使用vue-lazyload：在Vue的入口文件（通常是main.js或main.ts）中，引入vue-lazyload并通过Vue.use()方法使用它。在使用时，可以传递一个配置对象来自定义插件的行为，例如设置预加载高度、加载错误时的图片、加载中的图片等：

   import Vue from 'vue'
   import VueLazyload from 'vue-lazyload'
   
   Vue.use(VueLazyload, {
     preLoad: 1.3,
     error: 'path/to/error.jpg',
     loading: 'path/to/loading.gif',
     attempt: 1
   })
   

   这里的preLoad、error、loading和attempt是配置项，分别用于设置预加载的高度、加载失败时显示的图片、加载中显示的图片以及加载尝试的次数。

3. 在组件中使用v-lazy指令：安装并配置好vue-lazyload后，就可以在Vue组件的模板中使用v-lazy指令来代替传统的src属性加载图片了。例如：

   <template>
     <div>
       <img v-lazy="imageURL" alt="示例图片">
     </div>
   </template>
   

   在这个例子中，imageURL是包含图片URL的数据属性。当图片进入可视区域时，vue-lazyload会自动加载并显示图片。

通过上述步骤，可以在Vue项目中实现图片的懒加载，从而提高页面加载速度和用户体验。此外，vue-lazyload还支持背景图片的懒加载、组件的懒加载等高级功能，为开发者提供了更多的灵活性和选择。