加班中。。。。。。。。。。。。。。。。。。。。。。。。。。。

我们以前写路由是下面这样的

这导致了页面一多，我们的路由文件内容就比较多，不好看。

下面我为大家介绍一下，新的一种写法

这种写法，我们只需定义一个根目录，然后通过全局组件，通过正则匹配组件名替换组件就好了，这使得router文件不需要写很多东西。

以上两种写法都可以，第一种写法的好处是，不管谁接手这个项目，都可以清楚的找到页面路由，便于后期维护。

第二种写法虽然可以，但是有个缺点就是，后期维护，别人接手的话，是找不到组件的

vue-router的新奇写法的更多相关文章

  1. 「进阶篇」Vue Router 核心原理解析

    前言 此篇为进阶篇,希望读者有 Vue.js,Vue Router 的使用经验,并对 Vue.js 核心原理有简单了解: 不会大篇幅手撕源码,会贴最核心的源码,对应的官方仓库源码地址会放到超上,可以配 ...

  2. python 全栈开发，Day91(Vue实例的生命周期,组件间通信之中央事件总线bus,Vue Router,vue-cli 工具)

    昨日内容回顾 0. 组件注意事项!!! data属性必须是一个函数! 1. 注册全局组件 Vue.component('组件名',{ template: `` }) var app = new Vue ...

  3. Vue Router的懒加载路径

    单页应用产出的入口chunk大小随着业务的复杂度线性增加,导致后期加载速度越来越慢.后面就需要对不同路径下的模块进行拆分,打包到相应的chunk下,按需加载,找到chunk的大小.个数和页面加载速度的 ...

  4. Vue Router的简单了解

    Vue Router Vue Router官方文档 传统Web项目开发往往采用超链接实现页面之间的切换和跳转.Vue开发的是单页面应用(Single Page Application,SPA),不能使 ...

  5. Vue 2.0 + Vue Router + Vuex

    用 Vue.js 2.x 与相配套的 Vue Router.Vuex 搭建了一个最基本的后台管理系统的骨架. 当然先要安装 node.js(包括了 npm).vue-cli 项目结构如图所示: ass ...

  6. vue router 只需要这么几步

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  7. Vue.js 2.x笔记：路由Vue Router（6）

    1. Vue Router简介与安装 1.1 Vue Router简介 Vue Router 是 Vue.js 官方的路由管理器.它和 Vue.js 的核心深度集成,构建单页面应用. Vue Rout ...

  8. Vue Router学习笔记

    前端的路由:一个地址对应一个组件 Vue Router中文文档 一.路由基本使用 第1步:导入Vue Router: <script src="https://unpkg.com/vu ...

  9. vue router.push(),router.replace(),router.go()和router.replace后需要返回两次的问题

    转载:https://www.cnblogs.com/lwwen/p/7245083.html https://blog.csdn.net/qq_15385627/article/details/83 ...

  10. 前端MVC Vue2学习总结（八）——Vue Router路由、Vuex状态管理、Element-UI

    一.Vue Router路由 二.Vuex状态管理 三.Element-UI Element-UI是饿了么前端团队推出的一款基于Vue.js 2.0 的桌面端UI框架,手机端有对应框架是 Mint U ...

随机推荐

  1. mongoDB操作2

    一.find操作 MongoDB中使用find来进行查询,通过指定find的第一个参数可以实现全部和部分查询. 1.查询全部 空的查询文档{}会匹配集合的全部内容.如果不指定查询文档,默认就是{}. ...

  2. 团队Alpha冲刺（三）

    目录 组员情况 组员1(组长):胡绪佩 组员2:胡青元 组员3:庄卉 组员4:家灿 组员5:凯琳 组员6:丹丹 组员7:家伟 组员8:政演 组员9:鸿杰 组员10:刘一好 组员11:何宇恒 展示组内最 ...

  3. 《我是IT小小鸟》读笔

    兴趣是第一原则.一定要根据自己的兴趣确定发展方向,不要盲目从众和跟风.没有一个人的经历是可以复制的,多思考,不要照搬他人的做法,学习一下想法还是可以的,具体方法因人而异.学习软件技术时,不仅在知识节点 ...

  4. [pascal入门]数组

    一.本节目标 本节我们将要讲述数组.本节目标: 一维数组 二维数组 字符数组 二.一维数组 我们通过一个案例来简单的理解数组.班主任要计算班级里面50个同学数学成绩的平均成绩,道理上讲这是一个比较简单 ...

  5. 2nd scrum站立会议

    scrum站立会议 站立会议是让团队成员每日面对面站立互相交流他们所承担任务的进度.它的一个附带好处是让同组成员了解到工作的情况.本质上是为了团队交流,不是会议报告. 站立会议的目的: 1.让整个团队 ...

  6. oracle impdp导入时 提示“ORA-39002: 操作无效 ORA-39070: 无法打开日志文件 ”

    第一步:首先使用DBA权限的用户创建directory,我使用system ,可以在服务器本地创建,也可以远程连接sqlplus进行创建,使用的将是服务器上面的路径.要确保创建directory时,操 ...

  7. 第83天：jQuery中操作form表单

    操作form表单 1. 属性操作 设置属性: // 第一个参数表示:要设置的属性名称 // 第二个参数表示:该属性名称对应的值 $(selector).attr(“title”, “传智播客”); 获 ...

  8. HDU4045_Machine scheduling

    题意为要你从编号为1-n的所有机器中间选择出r个机器且每一个机器的编号只差不小于k-1,然后将选择的r个机器分为m组有多少种方案. 其实这题目的两个步骤是相互独立的. 总共的方案数等于选择的方案数乘以 ...

  9. 公告：请访问我的个人博客新站点——www.huangshujia.me

    我的个人博客现在在(http://www.huangshujia.me/)cnblog这里不会做任何更新了.或者关注我的个人公众号:碱基矿工

  10. 【loj6342】跳一跳 期望dp

    题目描述 一个人从 $1$ 开始向 $n$ 跳,在 $i$ 时会等概率跳到 $i,i+1,...,n$ 之一.求从 $1$ 跳到 $n$ 的期望步数. $n\le 10^7$ . 题解 期望dp傻逼题 ...