vue優化加載速度----懶加載圖片和異步加載路由（親測有效）

• 懶加載（圖片）

1.npm install vue-lazyload --save
此過程是下載懶加載包，但是可能會出現權限錯誤，建議使用npm install vue-lazyload --save --no-optional
2.在main.js中導入包並註冊（看截圖）
import VueLazyload from ‘vue-lazyload’
Vue.use(VueLazyload, {
error: ‘dist/error.png’,//這個是請求失敗後顯示的圖片
loading: ‘dist/loading.gif’,//這個是加載的loading過渡效果
try: 2 // 這個是加載圖片數量
})

3.在頁面中使用v-lazy代替:src添加請求的圖片地址

參數詳情：

• 異步加載頁面（路由）

白色框和紅色框是兩種寫法，白色框是在整體加載，紅色框是異步加載。很明顯異步加載的效果更好，推薦使用。