vue圖片懶加載vue-lazyload

• 需求描述
• 功能實現

需求描述

圖片過大，加載緩慢，圖片懶加載，添加Loading狀態，優化展示效果。

功能實現

1.安裝vue-lazyload

npm install vue-lazyload --save-dev

2.main.js中全局引用

import VueLazyload from "vue-lazyload"; Vue.use(VueLazyload, {preLoad: 1.3,error: require('../src/assets/images/error.png'),// 圖片錯誤的默認圖片loading: require('../src/assets/images/loading.gif'),// 圖片Loading狀態下的默認圖片attempt: 1 });

3.vue-lazyload的使用

總結

以上是生活随笔為你收集整理的vue图片懒加载vue-lazyload的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。