码迷,mamicode.com
首页 > 其他好文 > 详细

vue组件懒加载与路由懒加载的实现

时间:2019-11-03 20:40:39      阅读:132      评论:0      收藏:0      [点我收藏+]

标签:缺陷   default   out   组件   efault   项目   需要   数据   export   

在项目很大的时候,首页会一次导入所有页面与组件,可以使用懒加载实现项目的优化,但项目很小,不推荐使用,项目小,分开后的懒加载会发多次请求,带来更多的性能缺陷

路由写法

//假设components下有一个home.vue,需要在路由页面引入
new Router({
   routes:[{
    path:‘/‘,
    name:"home",
    components:()=>import("./components/home") //将路由顶部的引入,放在这里就实现路由的懒加载,()=>返回后面跟的一个数据,()=>{}是一个函数.
}]
    
});

//组件实现方法类似,假设要引入homechild组件
export default {
     name"home",
    components:{                    //注册vue组件
 homeChild:()=>import("./homeChild");
}
}

 

vue组件懒加载与路由懒加载的实现

标签:缺陷   default   out   组件   efault   项目   需要   数据   export   

原文地址:https://www.cnblogs.com/uimeigui/p/11788567.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!