router

router是VueRouter的一个对象,通过Vue.use(VueRouter)VueRouter构造函数得到一个router的实例对象,这个对象中是一个全局对象,他包含了所有的路由以及许多关键的对象和属性。

举例:history对象

$router.push({path:'home'})

本质是向history栈中添加一个路由,在我们看来是 切换路由,但本质是在添加一个history记录

$router.replace({path:'home'});//替换路由,没有历史记录

route

route表示一个当前活跃的路由对象,每一个路由都会有一个route对象,是一个局部的对象,包含name,path,params,query等属性,下面的例子就是一个route对象

 	{
path: 'table',
name: '讲师列表',
component: () => import('@/views/edu/teacher/list'),
meta: { title: '讲师列表', icon: 'table' }
},

我们可以从vue devtools中看到每个路由对象的不同

从上面的例子中可以看出两者的区别:

  • $route.path

    字符串,等于当前路由对象的路径,会被解析为绝对路径,如 "/home/news"
  • $route.params

    对象,包含路由中的动态片段和全匹配片段的键值对
  • $route.query

    对象,包含路由中查询参数的键值对。例如,对于 /home/news/detail/01?favorite=yes ,会得到$route.query.favorite == 'yes'
  • $route.router

    路由规则所属的路由器(以及其所属的组件)。
  • $route.matched

    数组,包含当前匹配的路径中所包含的所有片段所对应的配置参数对象。
  • $route.name

    当前路径的名字,如果没有使用具名路径,则名字为空。

route几个属性涉及到路由参数传递:传送门:路由参数传递

参考文章

随机推荐

  1. git 合并分支 git merge branch_name

    * 查看分支 git branch * 更新 git pull * 切换到master分支 git checkout master Checking out files: 100% (907/907) ...

  2. greedy algorithm, insertion sort, quick sort

    always makes the choice that seems to be the best at that moment. Example #1: @function:  scheduling ...

  3. 『Python』matplotlib的imshow用法

    热力图是一种数据的图形化表示,具体而言,就是将二维数组中的元素用颜色表示.热力图之所以非常有用,是因为它能够从整体视角上展示数据,更确切的说是数值型数据. 使用imshow()函数可以非常容易地制作热 ...

  4. RabbitMQ3.9.7在CentOS7中的安装搭建

    1.概述 RabbitMQ 是目前很流行的消息中间件之一,可靠性非常好,能简单的实现高可用.负载均衡. 今天我们先来聊一下 RabbitMQ 3.9.7 版本在 CentOS7 中的安装. 2.安装R ...

  5. 鸿蒙内核源码分析(内存映射篇) | 虚拟内存虚在哪里 | 百篇博客分析OpenHarmony源码 | v15.03

    百篇博客系列篇.本篇为: v15.xx 鸿蒙内核源码分析(内存映射篇) | 虚拟内存虚在哪里 | 51.c.h .o 内存管理相关篇为: v11.xx 鸿蒙内核源码分析(内存分配篇) | 内存有哪些分 ...

  6. 基于 Vuex 的时移操作(撤回/恢复)实现

    最近做了一个 BI 平台的可视化看板编辑器,项目刚做完一期,各方面的功能都还能粗糙,但该有的也都有了,比如编辑器场景下最基本的两类时移操作-撤回(undo) 和恢复 (redo). 用 vuex 实现 ...

  7. JavaWeb#JSP内置对象

    [1.JSP内置对象简介] 内置对象:不加声明就可以在JSP页面脚本中使用的成员变量.(使用这些对象可以更容易收集客户端发送的请求信息,响应客户端的请求及存储客户信息.) 主要介绍:out,reque ...

  8. 如何评估 Serverless 服务能力?这份报告给出了 40 条标准

    编者按:两年前,我们还在讨论什么是 Serverless,Serverless 如何落地.如今,已经有评测机构给出了 40 条标准来对 Serverless 的服务能力进行评估,这些评估细则既是技术生 ...

  9. cmd下载慢

    是网络的原因,加一个镜像服务器 pip install *** -i https://pypi.tuna.tsinghua.edu.cn/simple

  10. 创建第一个Android项目

    目录 创建第一个Android项目 创建HelloWorld项目 选择模板 选择模板界面的英文翻译 配置项目 配置项目界面英文翻译及解释 配置项目界面的注意事项 Name的命名规范 Package n ...