首先，确保你的项目中已经安装了 Vant。如果没有安装，可以使用以下命令：
npm install vant
然后，在你的 Vue 组件中引入 Vant Lazyload 组件：
<template>
<div>
<!-- 使用 Lazyload 组件包裹图片 -->
<van-lazyload>
<img src="https://example.com/image.jpg" alt="Lazy-loaded Image">
</van-lazyload>
</div>
</template>
<script>
import { Lazyload } from 'vant';
export default {
components: {
[Lazyload.name]: Lazyload,
},
};
</script>
在上面的例子中，我们引入了 Vant 的 Lazyload 组件，并在模板中使用了 van-lazyload 标签包裹需要进行懒加载的图片。当图片进入用户视口时，Lazyload 会自动加载图片。
你还可以根据需要配置 Lazyload 组件，例如设置默认占位图、加载失败时的占位图等。具体的配置选项可以参考 Vant 官方文档。
确保在项目中引入了 Vant 的样式文件，以确保样式正确显示。
转载请注明出处：http://www.zyzy.cn/article/detail/5683/Vant