溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章主要介紹vue.js使用懶加載的方法，文中介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們一定要看完！
vue.js使用懶加載的方法：首先安裝lazyload；然后在【main.js】中全局引用， 并配置圖片；最后vue文件中將需要懶加載的圖片綁定【v-bind:src】修改為【v-lazy】。
vue.js使用懶加載的方法：
1、安裝lazyload
npm install lazyload -s
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、vue文件中將需要懶加載的圖片綁定 v-bind:src 修改為 v-lazy
<img v-lazy="'@/assets/images/27.png'" class="images-line">
4、lazyload引用相對路徑的圖片引用不成功？運營require引用圖片
<img v-lazy="require('@/assets/images/eight.png')" class="eight-top">以上是“vue.js使用懶加載的方法”這篇文章的所有內容，感謝各位的閱讀！希望分享的內容對大家有幫助，更多相關知識，歡迎關注億速云行業資訊頻道！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
