vue1.0 lazyload

在 Vue 1.0 中实现图片的 lazyload 需要借助第三方插件，比如使用 vue-lazyload 插件。

使用方法如下：

1. 首先需要安装 vue-lazyload 插件，可以使用 npm 安装，命令如下：

npm install vue-lazyload --save

2. 在 main.js 中引入 vue-lazyload 插件，并将其注册为 Vue 的插件：

import Vue from 'vue'
import VueLazyload from 'vue-lazyload'

Vue.use(VueLazyload)

3. 在需要实现图片 lazyload 的组件中，将需要 lazyload 的图片的 src 属性替换为 v-lazy 属性，如下所示：

<template>
  <div>
    <img v-lazy="imgUrl" />
  </div>
</template>

<script>
export default {
  data() {
    return {
      imgUrl: 'https://example.com/image.jpg'
    }
  }
}
</script>

这样就可以实现图片的 lazyload，当图片进入可视区域时才会加载。同时，vue-lazyload 还支持一些参数配置，比如占位图、加载错误时的显示等，可以参考官方文档进行配置。