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

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

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

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

这种写法，我们只需定义一个根目录，然后通过全局组件，通过正则匹配组件名替换组件就好了，这使得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. mysql innodb myisam 比较

    InnoDB: 支持事务处理等 不加锁读取 支持外键 支持行锁 不支持FULLTEXT类型的索引 不保存表的具体行数,扫描表来计算有多少行 DELETE 表时,是一行一行的删除 InnoDB 把数据和 ...

  2. 2017年度网络安全服务企业TOP50

    何谓“大安全”? 近几年来,网络安全和信息安全领域不时出现引发社会各界关注的事件. 2014年,政府采购计划对WIN8说“不”,同年,中央网络安全和信息化领导小组成立,将网络安全上升到了国家战略高度, ...

  3. scrum立会报告+燃尽图（第三周第一次）

    此作业要求参见:https://edu.cnblogs.com/campus/nenu/2018fall/homework/2284 项目地址:https://coding.net/u/wuyy694 ...

  4. HTTP vs HTTPS

    参考博文:HTTP与HTTPS的区别 HTTP与HTTPS的区别 一.HTTP和HTTPS的基本概念和区别 HTTP: 是互联网上应用最为广泛的一种网络协议,是一个客户端和服务器端请求和应答的标准(T ...

  5. 0527 SCRUM团队项目7.0

    Sprint回顾 让我们一次比一次做得更好.   1.回顾组织 主题:“我们怎样才能在下个sprint中做的更好?” 时间:设定为1至2个小时. 参与者:整个团队. 场所:能够在不受干扰的情况下讨论. ...

  6. CentOS7安装.NET Core运行环境

    安装.NET Core ->首先需要删除以前安装的版本 -> 获取安装脚本 curl -sSL https://raw.githubusercontent.com/dotnet/cli/r ...

  7. 团队项目-BUG排查-ADT工程 To Android Studio 一整天的排查日记

    4-22 10:44至4-23 0:45 ①打开Eclipse从Github上Clone MathsApp到本机,报错'Unable to resolve target'android-19' ②尝试 ...

  8. 《构建之法》第6~7章读后感和对Scrum的理解

    第6章 敏捷流程 “敏捷流程”是一系列价值观和方法论的集合.从2001年开始,一些软件界的专家开始倡导“敏捷”的价值观和流程, 他们肯定了流行做法的价值,但是强调敏捷的做法更能带来价值. 敏捷开发原则 ...

  9. 一些Redis面试题

    1. 使用Redis有哪些好处? (1) 速度快,因为数据存在内存中,类似于HashMap,HashMap的优势就是查找和操作的时间复杂度都是O(1) (2) 支持丰富数据类型,支持string,li ...

  10. App流量测试--使用安卓自身提供的TCP收发长度统计功能

    在Linux系统有3个地方保存流量统计文件,对于Android系统同样也适用: (1)在/proc/net/dev下可以查看各个网络接口的收发流量  (等同adb shell cat /proc/pi ...