nuxt2 图片懒加载

在 Nuxt.js 中，可以使用 vue-lazyload 插件来实现图片懒加载。具体步骤如下：

1. 安装 vue-lazyload 插件：

npm install vue-lazyload --save

2. 在 nuxt.config.js 中引入插件并配置：

// nuxt.config.js

module.exports = {
  // ...
  plugins: [
    { src: '~/plugins/vue-lazyload', ssr: false }
  ]
}

// ~/plugins/vue-lazyload.js

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

Vue.use(VueLazyload, {
  preLoad: 1.3,
  error: '/error.png',
  loading: '/loading.gif',
  attempt: 1
})

3. 在需要懒加载的图片上使用 v-lazy 指令：

<template>
  <div>
    <img v-lazy="imageUrl" alt="image">
  </div>
</template>