1. match通过路径
<Route path="/path/:name" component={example} />
路由组件内获取参数使用
this.props.match.params.name
2. query String 通过search
//mirrorx中使用push的参数search,link中使用与此类似
actions.routing.push({
  pathname: '/path/example',
  search: `?name=${name}`,
 }
)
路由组件内获取参数使用
this.props.location.search
是个字符串,可以使用querySrirng方法来获取指定参数
原来this.props.location.query.name这种方式在v4版本中不再可用,老版本获取参数方式

React router 4 获取路由参数,跨页面参数的更多相关文章

  1. 前端JS获取路由地址里的参数QueryString取值

    参数的获取 声明一个函数 //参数name是路由参数 engNo function getQueryString(name) { var reg = new RegExp("(^|& ...

  2. React Router学习笔记(转自阮一峰老师博客)

    React Router是一个路由库,通过管理URL来实现组件切换和状态转变. 1.安装和使用 $ npm install -S react-router 在使用时,作为React组件导入 impor ...

  3. vue 页面间使用路由传参数,刷新页面后获取不到参数的问题

    情况 情况再简单说明一下: 有三个页面(a-列表页面,b-内页1,c-内页2),页面a->页面b->页面c有参数传递.从a进入b后,刷新b页面拿不到a页面传进来的参数.或者b页面再进入c页 ...

  4. vue如何配置路由 、获取路由的参数、部分刷新页面、缓存页面

    vue如何配置路由 .获取路由的参数.部分刷新页面.缓存页面:http://www.mamicode.com/info-detail-1941546.html vue-router传递参数的几种方式: ...

  5. React Router v4 页面传值的三种方法

    传值方法 1.props.params 使用React router定义路由时,我们可以给指定一个path,然后指定通配符可以携带参数到指定的path: <Route path='/user/: ...

  6. vue路由传参的三种方式以及解决vue路由传参页面刷新参数丢失问题

    最近项目中涉及到跨页面传参数和后台进行数据交互,看到需求之后第一反应就是用路由传参来解决:Vue中给我们提供了三种路由传参方式,下面我们一个一个的来看一下: 方法一:params传参: this.$r ...

  7. vue路由传参页面刷新参数丢失问题解决方案

    最近项目中涉及到跨页面传参数和后台进行数据交互,看到需求之后第一反应就是用路由传参来解决:Vue中给我们提供了三种路由传参方式,下面我们一个一个的来看一下: 方法一:params传参: this.$r ...

  8. react router @4 和 vue路由 详解(六)vue怎么通过路由传参?

    完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html 8.vue怎么通过路由传参? a.通配符传参数 //在定义路由的时候 { path: ' ...

  9. react router @4 和 vue路由 详解(全)

    react router @4 和 vue路由 本文大纲: 1.vue路由基础和使用 2.react-router @4用法 3.什么是包容性路由?什么是排他性路由? 4.react路由有两个重要的属 ...

随机推荐

  1. 域名添加www之后(或域名后加端口)无法访问(阿里云服务器)

    当时在阿里云服务器上部署了一个api接口,通过APP调用一直很正常,突然无法访问了,然后测试调查发现,只要在域名前加上www,再通过域名加端口的方式访问的话, 显示的都是 :502 错误:还一直以为是 ...

  2. asp.net core2.1项目应用Ant Design(一)

    无意中发现了Ant Design这个组件库后,深深被他丰富的组件吸引了,大家感兴趣的可以去官网感受下,组件的应用和效果真是的太强大了,对于我们这些小公司,无自主研发前端团队的来说,无疑特别方便:htt ...

  3. Objective-C description方法 SEL类型

    description方法 #import "Person.h" @implementation Person - (void) setAge : (int) age { _age ...

  4. tpo-09 C2 Return a sociology book

    check out 在library里有借书的意思 第 1 段 1.Listen to a conversation between a student and a librarian employe ...

  5. sqlalchemy 转json 的几种常用方式

    sqlalchemy 转json 的几种常用方式 # -*- coding:utf-8 -*- import datetime from flask import Flask, json, jsoni ...

  6. 树的层次遍历(Trees on the level,UVA 122)

    题目描述: 题目思路: 1.用结构链表来建树 2.用队列来实现层次遍历,当遍历到根节点时,将其子节点压入队列 #include <iostream> #include <cstdli ...

  7. Java进阶知识点:并发容器背后的设计理念

    一.背景 容器是Java编程中使用频率很高的组件,但Java默认提供的基本容器(ArrayList,HashMap等)均不是线程安全的.当容器和多线程并发编程相遇时,程序员又该何去何从呢? 通常有两种 ...

  8. lock+Condition

    关键字 synchronized+wait/notify/notifyAll可以实现等待/通知模式,类ReentrantLock可以实现同样的功能,但需要借助Condition对象.Condition ...

  9. 深度学习笔记 (一) 卷积神经网络基础 (Foundation of Convolutional Neural Networks)

    一.卷积 卷积神经网络(Convolutional Neural Networks)是一种在空间上共享参数的神经网络.使用数层卷积,而不是数层的矩阵相乘.在图像的处理过程中,每一张图片都可以看成一张“ ...

  10. solidity事件详解

    很多同学对Solidity 中的Event有疑问,这篇文章就来详细的看看Solidity 中Event到底有什么用? 写在前面 Solidity 是以太坊智能合约编程语言,阅读本文前,你应该对以太坊. ...