方法1 《刷新页面参数会消失》

<Link className="item" to={{pathname:'/order',params:{index :"3"}}}>
  <i className="icon iconfont icon-shangpingouwudai2"></i>
  <p>售后</p>
</Link>

方法2  《刷新页面参数会消失》

<div className="item" onClick={this.go_order.bind(this,index)}>
  <i className="icon iconfont icon-shangpingouwudai2"></i>
  <p>测试</p>
</div>

go_order(index){
  this.props.history.push({pathname:"/order",params:{index :index}});
}
方法3 《刷新页面参数还在》
<Route path="/order/:index" component={Order} /> 

<Link className="item" to={{pathname:'/order/'+0}}>
  <i className="icon iconfont icon-shangpingouwudai2"></i>
  <p>待付款</p>
</Link>

方法4 《刷新页面参数还在》
<Route path="/order/:index" component={Order} />

<div className="item" onClick={this.go_order.bind(this,index)}>
  <i className="icon iconfont icon-shangpingouwudai2"></i>
  <p>测试</p>
</div>

go_order(index){
  this.props.history.push("/order/"+index);
}

  

react路由传参的更多相关文章

  1. react 路由传参

    今天,我们要讨论的是react router中Link传值的三种表现形式.分别为通过通配符传参.query传参和state传参. ps:进入正题前,先说明一下,以下的所有内容都是在react-rout ...

  2. react --- 路由传参的几种方式

    1.params 优势 : 刷新地址栏,参数依然存在缺点:只能传字符串,并且,如果传的值太多的话,url会变得长而丑陋. 2.query 优势:传参优雅,传递参数可传对象:缺点:刷新地址栏,参数丢失 ...

  3. React路由传参的三种方式

    方式 一:          通过params         1.路由表中                     <Route path=' /sort/:id '   component= ...

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

    完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html 7.react怎么通过路由传参? a.通配符传参(刷新页面数据不丢失) //在定义路由的 ...

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

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

  6. 8.MVC框架开发(URL路由配置和URL路由传参空值处理)

    1.ASP.NET和MVC的路由请求处理 1)ASP.NET的处理 请求---------响应请求(HttpModule)--------处理请求(HttpHandler)--------把请求的资源 ...

  7. vue链接传参与路由传参

    1.链接传参: 例如:链接是:http://localhost:3333/#/index?id=001 我们要获取参数:console.log(this.$route.query.id):即可 2.路 ...

  8. vue路由传参的三种方式区别(params,query)

    最近在做一个项目涉及到列表到详情页的参数的传递,网上搜索一下路由传参,结合自己的写法找到一种适合自己的,不过也对三种写法都有了了解,在此记录一下 <ul class="table_in ...

  9. vue动态路由配置,vue路由传参

    动态路由: 当我们很多个页面或者组件都要被很多次重复利用的时候,我们的路由都指向同一个组件,这时候从不同组件进入一个"共用"的组件,并且还要传参数,渲染不同的数据 这就要用到动态路 ...

随机推荐

  1. Java 之集合框架 中(10)

    Map和HashMap Map接口: Map 提供了一种映射关系,其中的元素是以键值对(Key-Value)的形式 存储的,能够实现根据Key快速查找value Map中的键值对以Entry类型的对象 ...

  2. Eclipse 分屏显示同一个代码文件

    描述: 今天在使用Eclipse开发的时候不知按错哪个键,出现编辑框分屏显示同一个代码,由于之前没有使用过这一功能,所以就去查了一下,原来是Eclipse的分屏功能. 快捷键: 方式一:Window ...

  3. Windows下部署ElasticSearch5.0以下版本

    Windows下部署ElasticSearch分ElasticSearch5.0以上版本(包括5.0)和ElasticSearch5.0以下版本两种情况,这两种安装方式有很大不同.今天首先说Elast ...

  4. [翻译] MSAlertController

    MSAlertController You can use AlertController in iOS7!! 你可以在iOS中使用AlertController了 MSAlertController ...

  5. Java学习---JDK的安装和配置

    控制面板\系统和安全\系统 CLASSPATH %JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar; JAVA_HOME C:\Program Files ...

  6. Java学习---多线程的学习

    基础知识 每个正在系统上运行的程序都是一个进程(process).每个进程包含一到多个线程(thread).进程也可能是整个程序或者是部分程序的动态执行. 线程是一组指令的集合,或者是程序的特殊段,它 ...

  7. 添加PHP扩展模块

    php安装好后,可能在初次安装时,会有些模块会有遗漏,但是我们又不想重新编译php,因为耗时是比较长的.我们可不可以在不重新编译安装php的情况下,来为php单独添加某一个模块呢?查找资料,发现还是有 ...

  8. recycle bin tip

    if you have a question about recycle bin that can look the follow link; http://www.dba-oracle.com/t_ ...

  9. webbench 网站压力测试

    [root@localhost ~]# webbench -c 500 -t 4 http://172.24.61.41/Webbench - Simple Web Benchmark 1.5Copy ...

  10. August 14th 2017 Week 33rd Monday

    Life is like a watch, you can return to the starting point, they are not yesterday! 人生就像钟表,可以回到起点,却已 ...