第一步:安裝插件
npm i vue-lazyload --save
第二步:在main.js中引入,並使用
參數參考網址:https://www.npmjs.com/package/vue-lazyload
第二步:使用插件
第三步:在需要使用懶加載圖片的頁面使用v-lazy指令,
在圖片加載之前先使用loading裏面的圖片,當圖片加載之後使用加載後的圖片;
它會時時檢測圖片滾動的位置,當頁面沒有滾動到圖片的位置時,它是不會加載的;
圖片懶加載的顏色也是可以調整的,點擊開sgv圖片,去設置fill屬性,部分懶加載sgv圖片下載