<router-link> 组件支持用户在具有路由功能的应用中 (点击) 导航。 通过 to 属性指定目标地址,默认渲染成带有正确链接的 <a> 标签,可以通过配置 tag 属性生成别的标签.。另外,当目标路由成功激活时,链接元素自动设置一个表示激活的 CSS 类名router-link-active。

编程式导航:

path

name+params

path+query

如果用path+params,后面的params不会生效

命名多个视图:

router.beforeEach全局前置守卫

router.beforeResolve全局解析守卫

router.afterEach全局后置钩子

beforeEnter路由独享守卫

组件内的守卫:beforeRouterEnter(不能访问this,守卫在导航确认前被调用,因此即将登场的新组件还没被创建。不过,你可以通过传一个回调给 next来访问组件实例。在导航被确认的时候执行回调,并且把组件实例作为回调方法的参数。)、beforeRouterUpdate、beforeRouterLeave(这个离开守卫通常用来禁止用户在还未保存修改前突然离开。该导航可以通过 next(false) 来取消。)

router-link的更多相关文章

  1. [Redux] Navigating with React Router <Link>

    We will learn how to change the address bar using a component from React Router. In Root.js: We need ...

  2. Vue router link

    html: <router-link to="test">Go to Foo</router-link> <router-link to=" ...

  3. [React] React Router: Router, Route, and Link

    In this lesson we'll take our first look at the most common components available to us in react-rout ...

  4. angular2 学习笔记 ( Router 路由 )

    参考 : https://angular.cn/docs/ts/latest/guide/router.html#!#can-activate-guard https://angular.cn/doc ...

  5. [React] React Router: Redirect

    The Redirect component in react-router does exactly what it sounds like. It allows us to redirect fr ...

  6. [React] React Router: Querystring Parameters

    Define query param in Link, accept path and query : const Links = () => <nav > <Link to= ...

  7. [React] React Router: Named Components

    In this lesson we'll learn how to render multiple component children from a single route. Define a n ...

  8. [React] React Router: Route Parameters

    A router library is no good if we have to hardcode every single route in our application. In this le ...

  9. [React] React Router: IndexRoute

    IndexRoute allows us to define a default child component to be rendered at a specific route when no ...

  10. [React] React Router: Nested Routes

    Since react-router routes are components, creating nested routes is as simple as making one route a ...

随机推荐

  1. Min swaps to sort array

    Given an array with distinct numbers, return an integer indicating the minimum number of swap operat ...

  2. 【Python】【demo实验15】【练习实例】【两个数范围内素数的统计】

    原题: 判断101-200之间有多少个素数,并输出所有素数. 关于素数的统计,之前已经做过相应的实验了,参考:[显示素数,显示两个数范围内的所有素数] 原题给出的解法,使用math的sqrt函数,这个 ...

  3. delphi 相关好的资料网站

    1.Delphi编程技巧大全   http://www.delphitop.com/  (实例讲解所有组件) 2.Delphi学习大师  Delphi基础教程 视频教程  http://www.xue ...

  4. 自定义函数(function)

    USE [NC] GO /****** Object: UserDefinedFunction [dbo].[dict_url_channel] Script Date: 2019/5/25 16:4 ...

  5. mysql查询出数据更新到另一张表

    公司今天有个需求,大体意思就是把一个表的玩家游戏场数统计出来,然后赋值到另一张表的字段上,说白了就是两张表,但是查询出来的玩家账号和次数是多条,尝试很多种写法都没用,最后用了最笨的方式解决. -- - ...

  6. php socket 编程读写函数

    fwrite() 二进制安全 end条件[string写完/length-1]; fputs() fwrite()的别名; fread() 二进制安全,end条件[一个可用包/EOF/length-1 ...

  7. Hinton等人新研究:如何更好地测量神经网络表示相似性

    Hinton等人新研究:如何更好地测量神经网络表示相似性 2019年05月22日 08:39:15 喜欢打酱油的老鸟 阅读数 177更多 分类专栏: 人工智能   https://www.toutia ...

  8. 11-Perl 运算符

    1.Perl 运算符运算符是一种告诉编译器执行特定的数学或逻辑操作的符号,如: 3+2=5.Perl 语言内置了丰富的运算符,我们来看下常用的几种: 算术运算符,比较运算符,逻辑运算符,赋值运算符,位 ...

  9. oracle创建用户表空间

    --本次因工作需要,为其他部门提供部分表数据,创建一个新用户与表空间.--system用户下drop user sys_outside cascade;drop tablespace sys_outs ...

  10. centos配置发送邮件

    邮件已经可以接收到了 CentOS下发送邮件有很多种方法,这里采用比较简单的mail客户端,配置第三方邮件服务商,例如:163.com 1.安装所用软件 yum install mailx sendm ...