vue picture lazy loading lazyload most use

Pictures lazy loading is to unify the img src is set to a default of the initial picture, when it finished loading the picture, the real picture will only link to fill img src attribute. Use the following steps:

1 Plug
cnpm install vue-lazyload --save-dev

2 main.js introduced

import VueLazyLoad from 'vue-lazyload'
Vue.use(VueLazyLoad,{
    error:require('./statics/site/imgs/erro.jpg'),
    loading:require('./statics/site/imgs/load.gif')
})

3 vue file in the picture: src = "" modify the v-lazy = ""

<img v-lazy="img"/>

Guess you like

Origin blog.csdn.net/smlljet/article/details/90256805