vue插件vue-lazyload懶加載插件的使用及在過程中遇到的圖片不更新問題

當網絡請求比較慢的時候,提前給這張圖片添加一個像素比較低的占位圖片，不至於堆疊在一塊，或顯示大片空白，讓用戶體驗更好一點。

1. 安裝插件：

npm install vue-lazyload --save-dev

2. main.js引入插件：

import VueLazyload from 'vue-lazyload' //引入這個懶加載插件

　Vue.use(VueLazyLoad,{
　　preLoad: 1.0, //圖片 設置顯示比例，默認為1.3
　　error:require('./assets/img/weixin_error.jpg'),  //加載失敗的顯示
　　loading: require('./assets/img/logo.png'),       //加載中的顯示
　　attempt: 1
　})

配置圖片位置這里，通過常用的路徑配置找不到圖片，所以我用的是require

具體的配置使用可以參考：

https://www.npmjs.com/package/vue-lazyload

3.在組件任何地方都可以直接使用把 img 里的:src -> v-lazy

<img v-lazy="圖片地址" :key="圖片地址">

注意>>>  ：key=""  必須要加，否則就會出現，頁面刷新，其他內容都刷新了，但是只有圖片不刷新的情況