使用vue-lazyload實現(xiàn)圖片懶加載
1粗仓、安裝插件 cnpm install --save vue-lazyload
cnpm install --save vue-lazyload
2集歇、引入組件src/main.js
import VueLazyload from 'vue-lazyload' // 圖片ngkm
Vue.use(VueLazyload, {
preLoad: 1, // 完全顯示之后再加載
error: require('@/assets/images/error.jpg'),
loading: require('@/assets/images/loading.gif'),
attempt: 1, // 嘗試加載次數(shù)
})
3棱诱、頁面中使用懶加載，把 :src 換成 v-lazy
<img v-lazy="ele.url" alt="" />
