1.安装npm包
npm install vue-lazyload --save
2.在main.js中引入全局
/*图片懒加载 */
import VueLazyload from 'vue-lazyload'
Vue.use(VueLazyload)
// 配置项
Vue.use(VueLazyload, {
preLoad: 1.3, //预加载高度
error: 'dist/error.png', //报错时需要的图片
loading: 'dist/loading.gif', //加载时需要的图片
attempt: 1 //尝试加载次数
})
3.页面调用(:src改成v-lazy)
<img
width="131px"
height="74px"
v-lazy="baseUrl + scope.row.imgUrl"
alt=""
/>