路由匹配规则是从上到下执行,一旦发现匹配,就不再其余的规则了。

(1):paramName

:paramName匹配URL的一个部分,直到遇到下一个/、?、#为止。这个路径参数可以通过this.props.params.paramName取出。 <Route path="/hello/:name"> // 匹配 /hello/michael // 匹配 /hello/ryan

(2)()

()表示URL的这个部分是可选的。 <Route path="/hello(/:name)"> // 匹配 /hello // 匹配 /hello/michael // 匹配 /hello/ryan

(3)*

*匹配任意字符,直到模式里面的下一个字符为止。匹配方式是非贪婪模式。 <Route path="/files/*.*"> // 匹配 /files/hello.jpg // 匹配 /files/hello.html (4) **

** 匹配任意字符,直到下一个/、?、#为止。匹配方式是贪婪模式。 <Route path="/**/*.jpg"> // 匹配 /files/hello.jpg // 匹配 /files/path/to/file.jpg

react router路径的匹配原则的更多相关文章

  1. 【Spring】15、spring mvc路径匹配原则

    Ant path 匹配原则 在Spring MVC中经常要用到拦截器,在配置需要要拦截的路径时经常用到<mvc:mapping/>子标签,其有一个path属性,它就是用来指定需要拦截的路径 ...

  2. spring mvc路径匹配原则

    Ant path 匹配原则 在Spring MVC中经常要用到拦截器,在配置需要要拦截的路径时经常用到<mvc:mapping/>子标签,其有一个path属性,它就是用来指定需要拦截的路径 ...

  3. [转] React Router 使用教程

    PS:react-route就是一个决定生成什么父子关系的组件,一般和layout结合起来,保证layout不行,内部的子html进行跳转 你会发现,它不是一个库,也不是一个框架,而是一个庞大的体系. ...

  4. React Router基础使用

    React是个技术栈,单单使用React很难构建复杂的Web应用程序,很多情况下我们需要引入其他相关的技术 React Router是React的路由库,保持相关页面部件与URL间的同步 下面就来简单 ...

  5. React Router 使用教程

    一.基本用法 React Router 安装命令如下. $ npm install -S react-router 使用时,路由器Router就是React的一个组件. import { Router ...

  6. 关于react router 4 的小实践

    详细代码栗子:https://github.com/wayaha/react-dom-CY clone然后 npm install npm start 分割线 1.这个项目使用create-react ...

  7. React Router 4.x 开发,这些雷区我们都帮你踩过了

    前言 在前端框架层出不穷的今天,React 以其虚拟 DOM .组件化开发思想等特性迅速占据了主流位置,成为前端开发工程师热衷的 Javascript 库.作为 React 体系中的重要组成部分:Re ...

  8. React Router教程

    React Router教程 React项目的可用的路由库是React-Router,当然这也是官方支持的.它也分为: react-router 核心组件 react-router-dom 应用于浏览 ...

  9. React Router API文档

    React Router API文档 一.<BrowserRouter> 使用HTML5历史记录API(pushState,replaceState和popstate事件)的<Rou ...

随机推荐

  1. React Router基础使用

    React是个技术栈,单单使用React很难构建复杂的Web应用程序,很多情况下我们需要引入其他相关的技术 React Router是React的路由库,保持相关页面部件与URL间的同步 下面就来简单 ...

  2. CCNA网络工程师学习进程(8)访问控制列表ACL

    前面几节我们介绍了路由器的路由配置,接下来几节我们将介绍路由器的高级配置应用,包括ACL.NAT.DHCP.PPP.VPN和远程连接等的配置.     (1)ACL概述:   ACL(Access C ...

  3. CODEFORCES 125E MST Company 巧用Kruskal算法

    题意:给定一个带权边无向图,求最小生成树,且满足第一个节点的度为固定的k 无解则输出-1 数据规模: 节点数n和限制k<=5000 边数m<=10^5 时限8sec 思路: 首先时限比较宽 ...

  4. python之FTP程序(支持多用户在线)

    转发注明出处:http://www.cnblogs.com/0zcl/p/6259128.html 一.需求 1. 用户加密认证 (完成)2. 允许同时多用户登录 (完成)3. 每个用户有自己的家目录 ...

  5. MyBatis 源码分析——介绍

    笔者第一次接触跟MyBatis框架是在2009年未的时候.不过那个时候的他并不叫MyBatis,而是叫IBatis.2010年的时候改为现在的名字--MyBatis.这几年过去了,对于笔者来讲有一点陌 ...

  6. 我的Java笔记

    第一章 一 计算机程序:一系列有序的指令集合. 二 java语言分为三个领域 javaSE java技术核心(桌面应用程序)qq 百度云 javaEE 企业版(面向internet的应用程序)京东 淘 ...

  7. GIS制图课程目录(持续整理)

    GIS制图课程目录 by 李远祥 由于过去一年都没有进行更新,近期终于抽出时间来进行相关知识的整理,因此,对专项技术进行了不同技术线条的梳理.为了方便阅读,特意整理一下全书的目录结构,希望对读者有帮助 ...

  8. ajax提交File文件

    <script type="text/javascript">    $(function() {        $("input[name='image'] ...

  9. jQuery选择器课堂随笔

      $(function(){   //并集选择器   /*   $("h2,ul").css("background","pink");* ...

  10. 通过映射关系 动态转义为统一格式的数据 (支持 JSON 和 XML )

    在很多的时候 我们都会 需要 将不同格式的数据  转换为 统一的数据格式 比如 将Json 源数据 { "b": [ { "c": "referenc ...