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添加请求的图片地址

参数详情：

• 异步加载页面（路由）

白色框和红色框是两种写法，白色框是在整体加载，红色框是异步加载。很明显异步加载的效果更好，推荐使用。