vue路由的懒加载:
1、什么是懒加载以及为什么要使用懒加载:
懒加载也就是延迟加载或者按需加载;
为什么要使用懒加载:
因为像vue这种单页面应用,如果不应用懒加载,运用webpack打包后的文件将会异常的大,当用户进入首页后,需要加载大量的组件,就会造成页面白屏的问题,不利于用户体验。
当运用懒加载,就可以将页面进行划分,,需要的时候加载页面,减少首页的加载压力;此时,进入首页就不用一次加载过多的资源造成用时过长,提高用户体验;
2、懒加载的两种方式:
(1)vue异步组件实现路由懒加载:
写法:
component:resolve =>require(["需要加载的模块"],resolve)
参数1:需要加载的模块
参数2:加载成功的参数
举例:
(2)es提出的import(推荐使用这种方式)
举例:
const hello = ()=>import (‘组件路径‘)
export default new Router( {
routes:[
{ path:‘/‘ , name : ‘hello‘ , component : ‘hello‘ }
]
} )
原文地址:https://www.cnblogs.com/kangkang1207/p/9986898.html
时间: 2024-11-04 23:23:21