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

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

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

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

这种写法，我们只需定义一个根目录，然后通过全局组件，通过正则匹配组件名替换组件就好了，这使得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. django的htpp请求之WSGIRequest

    WSGIRequest对象 Django在接收到http请求之后,会根据http请求携带的参数以及报文信息创建一个WSGIRequest对象,并且作为视图函数第一个参数传给视图函数.这个参数就是dja ...

  2. ubuntu16.04卸载火狐，Amazon

    一.卸载火狐: . dpkg --get-selections |grep firefox .sudo apt-get purge firefox unity-scope-firefoxbookmar ...

  3. jQuery之基本选择器

    1. 是什么? - 有特定格式的字符串2. 作用 - 用来查找特定页面元素3. 基本选择器 - #id : id选择器 - element : 元素选择器 - .class : 属性选择器 - * : ...

  4. Scrum 项目准备4.0

    4.0----------------------------------------------- 1.准备看板. 形式参考图4. 2.任务认领,并把认领人标注在看板上的任务标签上. 先由个人主动领 ...

  5. [转帖]Linux 的UTC 和 GMT

    1.问题 对于装有Windows和Linux系统的机器,进入Windows显示的时间和Linux不一致,Linux中的时间比Windows提前8个小时. 2.解决方法 修改/etc/default/r ...

  6. Sublime Text怎么设置文件在新标签打开?

    设置Sublime Text新标签页tab打开文件.Sublime Text Files not opening a new tab?每次打开文件,Sublime Text总是把当前的tab打开的文件 ...

  7. php反射机制应用

    用来获取指定的类的信息,包括类中的属性,方法,方法权限,注释等 用途:1.thinkPHP框架中的前置,后置控制器的实现 2.与debug_backtrace函数结合使用,文件调用的权限管理 使用方法 ...

  8. 树形结构的数据库表Schema设计-基于左右值编码

    树形结构的数据库表Schema设计 程序设计过程中,我们常常用树形结构来表征某些数据的关联关系,如企业上下级部门.栏目结构.商品分类等等,通常而言,这些树状结构需要借助于数据库完 成持久化.然而目前的 ...

  9. 在Eclipse中开发WEB项目

    本文的演示是从本地文件创建dynamic web project,从svn检出的同时创建dynamic web project于此类似.我们推荐使用解压版的tomcat6.x版本,来作为服务器.可以到 ...

  10. Mac下Java JNI 调C

    简介 JNI的实现步骤如下: 编写带有native声明的方法的Java类 使用javac命令编译编写的Java类 使用java -jni className 来生成后缀名为.h的头文件 使用其他语言( ...