插件地址:https://github.com/hilongjw/vue-lazyload
图片懒加载基本原理就是,初始时统一将img的src设置为一张默认图片,当图片暴露在你的视线或者达到了你设定的条件,才将真正的图片链接填入img的src属性,从而达到节省性能的目的。
1npm安装在指定的文件中
npm i vue-lazyload -S
2引用
在局部使用;即每张照片都要配置error loadding的照片
在全局使用的话,每个照片只要设置来源即可,加载和出错都是是统一的照片
1局部使用;
然后在组件中看这个就可以
全局使用;
在mian.js中
在局部组件中;
两部即可使用了