首页 > 其他分享 >Vue-Router 的懒加载如何实现

Vue-Router 的懒加载如何实现

时间:2023-08-20 14:55:36浏览次数:28  
标签:Vue const List list new path Router 加载

非懒加载: import List from '@/components/list.vue' const router = new VueRouter({ routes: [ { path: '/list', component: List } ] })   懒加载:

1.使用箭头函数+import动态加载

const List = () => import('@/components/list.vue') const router = new VueRouter({ routes: [ { path: '/list', component: List } ] })

 

2.使用箭头函数+require动态加载

const router = new Router({ routes: [ { path: '/list', component: resolve => require(['@/components/list'], resolve) } ] })

 

   

标签:Vue,const,List,list,new,path,Router,加载
From: https://www.cnblogs.com/huwenlong/p/17643984.html

相关文章

  • Vue CLI脚手架
    1、node_modules依赖包①我们通过项目终端输入npmi,就会生成该依赖包,依赖包会自动根据package.json文件中所有需要的东西进行封装下载,例如:jquery,vue2等等②该依赖包因为承载项目的所有内容,在项目大的时候其所占内存也会很大。③在项目传发时,依赖包是可以删除的,他人只需要输入npmi,......
  • Vue基础语法
    一、插槽1、格式放在子组件<slot>内容</slot>2、内容可以放任何模块的代码3、原理父组件引用时,填写内容会被应用到插槽css模块<style>.box{width:200px;height:200px;background-color:aqua;float:left;margin-right:20px;......
  • vuepress 安装报错问题
    关于vuepress部署出现样式的问题及解决6月前作者:我yi癫狂分类: 博客文章阅读(35)原文违法举报 目录vuepress部署出现样式问题vuepress个人博客部署遇到的一些问题1、js和css出现404问题2、每次都要重复操作打包、运行、上传github很麻烦怎么办?3、github.io无法打开怎......
  • vue-
    插槽slots 传html结构,父传子slot父组件子组件渲染作用域插槽内容可以访问到父组件的数据作用域,因为插槽内容本身是在父组件模板中定义的。具名插槽  插槽:子组件传给父组件数据,父组件传回子组件父子组件生命周期生命周期函数创建期:beforeCreate  create......
  • 从JDK源码级别彻底剖析JVM类加载机制
    类加载运行全过程当我们用java命令运行某个类的main函数启动程序时,首先需要通过类加载器把主类加载到JVM。publicclassMath{publicstaticfinalintinitData=666;publicstaticUseruser=newUser();publicintcompute(){//一个方法对应一块栈帧......
  • 前端vue自定义柱形图 选中更改柱形图颜色及文字标注颜色
    随着技术的发展,开发的复杂度也越来越高,传统开发方式将一个系统做成了整块应用,经常出现的情况就是一个小小的改动或者一个小功能的增加可能会引起整体逻辑的修改,造成牵一发而动全身。通过组件化开发,可以有效实现单独开发,单独维护,而且他们之间可以随意的进行组合。大大提升开发效率......
  • 前端Vue自定义等分底部菜单导航按钮 自适应文字宽度 可更改组件位置
    随着技术的发展,开发的复杂度也越来越高,传统开发方式将一个系统做成了整块应用,经常出现的情况就是一个小小的改动或者一个小功能的增加可能会引起整体逻辑的修改,造成牵一发而动全身。通过组件化开发,可以有效实现单独开发,单独维护,而且他们之间可以随意的进行组合。大大提升开发效率......
  • JavaScript性能优化指南:加速前端应用的加载速度
    在当今互联网发展迅猛的时代,用户对于网页加载速度的要求也越来越高。JavaScript是前端开发中不可或缺的一部分,但它也可能成为网页加载变慢的原因之一。本篇文章将带您了解一些JavaScript性能优化的最佳实践,以加速前端应用的加载速度。1.压缩和合并JavaScript文件减少JavaScrip......
  • vue.js:5108 [Vue warn]: Cannot find element: #body_container
    1、原因:我把Vue挂载元素的JS放在了html加载完成的前面了2、解决:放到html加载完成之后就可以了 ......
  • Vue技术
    ......