1、路由对象和路由匹配

路由对象,即$router会被注入每个组件中,可以利用它进行一些信息的获取。如

属性 说明
$route.path 当前路由对象的路径,如'/view/a'
$rotue.params 关于动态片段(如/user/:username)的键值对信息,如{username: 'paolino'}
$route.query 请求参数,如/foo?user=1获取到query.user = 1
$route.router 所属路由器以及所属组件信息
$route.matched 数组,包含当前匹配的路径中所包含的所有片段所对应的配置参数对象。
$route.name 当前路径名字

当然,你也可以在自己定义路由规则(map)的时候自定义字段,用以特殊目的。

全匹配片段的语法是使用通配符* 如,/user/*any就会匹配到任何以/user为开头的路径,并给params对象中赋值一个属性any

动态片段的语法就是使用:作为标志。

转自:http://www.jianshu.com/p/cb918fe14dc6

vue路由跳转 vue-router的使用的更多相关文章

  1. vue路由跳转报错解决

    vue路由跳转: setTimeout(function () { console.log(this); this.$router.push("/login"); },800) 语 ...

  2. 去除vue路由跳转地址栏后的哈希值#

    去除vue路由跳转地址栏后的哈希值#,我们只需要在路由跳转的管理文件router目录下的index.js中加上一句代码即可去掉哈希值# mode:"history" import ...

  3. Vue路由跳转到新页面时 默认在页面最底部 而不是最顶部 的解决

    今天碰到一个问题   vue路由跳转到新的页面时会直接显示页面最底部  正常情况下是显示的最顶部的  而且好多路由中不是全部都是这种情况  折腾好长时间也没解决  最后在网上找到了解决办法 其实原理很 ...

  4. vue路由跳转的方式

    vue路由跳转有四种方式 1. router-link 2. this.$router.push() (函数里面调用) 3. this.$router.replace() (用法同push) 4. t ...

  5. 详解vue 路由跳转四种方式 (带参数)

    详解vue 路由跳转四种方式 (带参数):https://www.jb51.net/article/160401.htm 1.  router-link ? 1 2 3 4 5 6 7 8 9 10 ...

  6. Vue路由跳转时显示空白页面,iview的使用

    最近在用iview做项目,需要实现登录,注册,忘记密码等功能.iview-admin本来就有登录功能,于是想照葫芦画瓢,实现登录界面的注册,忘记密码页面路由跳转. router.js里路由配置,刚开始 ...

  7. vue路由跳转取消上个页面的请求和去掉重复请求

    vue路由跳转取消上个页面的请求和去掉重复请求 axios 的二次封装(拦截重复请求.异常统一处理) axios里面拦截重复请求

  8. vue路由跳转时判断用户是否登录功能

    通过判断该用户是否登录过,如果没有登录则跳转到login登录路由,如果登录则正常跳转. 一丶首先在用户登录前后分别给出一个状态来标识此用户是否登录(建议用vuex): 简单用vuex表示一下,不会可以 ...

  9. 获取vue路由跳转路径

    平时BUG: 在vue中使用element ui 中的导航组件时,使用index作为跳转的路径,单击跳转没有问题,但是当刷新页面是,选项卡的激活 状态就变成初始化的了,起起初想到用获取window.l ...

  10. 8、vue路由跳转 params与query 路由传参

    params与query router文件下index.js里面,是这么定义路由的: { path: '/about', name: 'About', component: About } 用quer ...

随机推荐

  1. C/C++遍历文件夹和文件

    本方法可用于windows和linux双平台,采用C/C++标准库函数. 库函数 包含头文件 #include 用到数据结构_finddata_t,文件信息结构体的指针. struct _findda ...

  2. hdu 5040 Instrusive

    Instrusive Time Limit: 3000/1500 MS (Java/Others)    Memory Limit: 262144/262144 K (Java/Others)Tota ...

  3. 泛型集合转化为DataTable

    public class DataTableUtil { /// <summary> /// 泛型集合转化为dataTable /// </summary> /// <t ...

  4. HandlerThread实现数字时钟

    1.描述 刚看完Android多线程编程,对HandlerThread比较感兴趣,趁热巩固练习,实现一个了数字时钟,希望对学习HandlerThread有所帮助.如下: 启动一个HandlerThre ...

  5. HDU 6184 Counting Stars 经典三元环计数

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=6184 题意: n个点m条边的无向图,问有多少个A-structure 其中A-structure满足V ...

  6. Kafka Streams 剖析

    1.概述 Kafka Streams 是一个用来处理流式数据的库,属于Java类库,它并不是一个流处理框架,和Storm,Spark Streaming这类流处理框架是明显不一样的.那这样一个库是做什 ...

  7. [置顶] 基于FPGA的VGA简易显存设计&NIOS ii软核接入

    项目简介 本项目基于Altera公司的Cyclone IV型芯片,利用NIOS II软核,2-port RAM与时序控制模块,实现64*48分辨率的显存(再大的显存板载资源m9k不够用) 实现效果如下 ...

  8. MPLS LDP随堂笔记1

    LDP 的使用原因(对于不同协议来说) LDP的四大功能 发现邻居 hello 5s 15s 224.0.0.2 发现邻居关系 R1 UDP 646端口 R2 UDP 646端口 此时形成邻居 建立邻 ...

  9. 201521123035《Java程序设计》第八周学习总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结集合与泛型相关内容. 1.2 选做:收集你认为有用的代码片段 //泛型方法,打印MyStack的所有元素的薪水,不管MyStack中 ...

  10. 201521123092《java程序设计》第六周学习总结

    1.本周学习总结 面向对象学习暂告一段落,请使用思维导图,以封装.继承.多态为核心概念画一张思维导图,对面向对象思想进行一个总结. 2.书面作业 1.clone方法 1.1 Object对象中的clo ...