在加载图片的过程中,经常由于图片加载太慢导致界面不友好,可以通过懒加载的方式实现让图片加载完成后再显示原图
在Vue中,可以利用vant的组件Lazyload 图片懒加载来实现
官方网址 Lazyload
首先因为 LazyLoad 是Vue的指令,我们需要在 main.js 中引用它
import {
Lazyload } from 'vant';
Vue.use(Lazyload);
页面中设置图片懒加载
<img v-lazy="url"
在加载图片的过程中,经常由于图片加载太慢导致界面不友好,可以通过懒加载的方式实现让图片加载完成后再显示原图
在Vue中,可以利用vant的组件Lazyload 图片懒加载来实现
官方网址 Lazyload
首先因为 LazyLoad 是Vue的指令,我们需要在 main.js 中引用它
import {
Lazyload } from 'vant';
Vue.use(Lazyload);
页面中设置图片懒加载
<img v-lazy="url"