Vue小技巧-懒加载

Vue懒加载包括图片懒加载与路由懒加载

1、图片懒加载：

首先安装 vue-lazyload包

然后导入并加载事先下载好的加载图片

import VueLazyLoad from 'vue-lazyload' Vue.use(VueLazyLoad,{ loading: require('@/common/image/default.png') })

在使用时可以在需要加载图片的位置使用：

<img width="100" heigth="100" v-lazy="item.picUrl"/>

 

2、路由懒加载：

路由懒加载可以按需调用需要的组件

箭头函数返回一个import路径

const Disc = ()=> import('@/components/disc/disc')

然后正常调用即可

{ path: ':id', component: Disc }

 

转载于:https://www.cnblogs.com/xiaopi-python/p/8554816.html