<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. [计蒜客T2237]魔法_树

    魔法 题目大意: 数据范围: 题解: 这个题挺好玩的 可以用反证法,发现所有叶子必须都得选而且所有叶子都选了合法. 故此我们就是要使得,一次操作之后使得叶子的个数最少. 这怎么弄呢? 我们发现,如果一 ...

  2. Educational Codeforces Round 68 (Rated for Div. 2)补题

    A. Remove a Progression 签到题,易知删去的为奇数,剩下的是正偶数数列. #include<iostream> using namespace std; int T; ...

  3. 【spring Boot】spring boot获取资源文件的三种方式【两种情况下】

    首先声明一点,springboot获取资源文件,需要看是 1>从spring boot默认的application.properties资源文件中获取 2>还是从自定义的资源文件中获取 带 ...

  4. asp.net 1.HTTP协议

    1.概念 协议是指计算机通信网络中两台计算机之间进行通信所必须共同遵守的规定或规则,超文本传输协议(HTTP)是一种通信协议,它允许将超文本标记语言(HTML)文档从Web服务器传送到客户端的浏览器. ...

  5. luogu题解 UVA11992 【Fast Matrix Operations】

    题目链接: https://www.luogu.org/problemnew/show/UVA11992 题目大意: 一个r*c的矩阵,一开始元素都是0,然后给你m次三种操作,分别是将一个子矩阵中所有 ...

  6. vue页面中图片不显示解决

    在做新版组态界面的时候,用vue框架实现,在配置页面图片的时候发现有一张图片明明页面输入的路径是对的可是图片就是不显示出来 现象: network页面资源也不报错,而且状态码竟然还是200,点prev ...

  7. vue入门:(模板语法与指令)

    vuejs使用及HTML的模板语法,可以实现声明式将DOM绑定至底层VUE实例的数据.通过模板语法将数据渲染进DOM的系统,结合响应系统,在应用状态改变时,Vue能够计算出重新渲染组件的最小代价并应用 ...

  8. 移动端tab切换时下划线的滑动效果

    1.当前 tab 出现下划线的同时,前一个下划线同时消失(出现方向与消失方向保持一致),伴随过渡效果. <!DOCTYPE html><html lang="en" ...

  9. 宝塔控制面板+wordpress搭建个人网站

    上个月买了服务器和域名之后就搁置了,今天有空闲就来配合教程尝试一下搭建个人网站,下面是网站搭建的详细过程以及中间的一些细节问题,写这篇文章的目的就是希望能够帮到一些小伙伴,或者为以后搭建网站做一些参考 ...

  10. TVM调试指南

    1. TVM安装 这部分之前就写过,为了方便,这里再复制一遍. 首先下载代码 git clone --recursive https://github.com/dmlc/tvm 这个地方最好使用--r ...