Vue小技巧-懒加载

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

}

以上是 Vue小技巧-懒加载 的全部内容, 来源链接: utcz.com/z/374835.html

回到顶部