react路由传参
方法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路由传参的更多相关文章
- react 路由传参
今天,我们要讨论的是react router中Link传值的三种表现形式.分别为通过通配符传参.query传参和state传参. ps:进入正题前,先说明一下,以下的所有内容都是在react-rout ...
- react --- 路由传参的几种方式
1.params 优势 : 刷新地址栏,参数依然存在缺点:只能传字符串,并且,如果传的值太多的话,url会变得长而丑陋. 2.query 优势:传参优雅,传递参数可传对象:缺点:刷新地址栏,参数丢失 ...
- React路由传参的三种方式
方式 一: 通过params 1.路由表中 <Route path=' /sort/:id ' component= ...
- react router @4 和 vue路由 详解(五)react怎么通过路由传参
完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html 7.react怎么通过路由传参? a.通配符传参(刷新页面数据不丢失) //在定义路由的 ...
- react router @4 和 vue路由 详解(六)vue怎么通过路由传参?
完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html 8.vue怎么通过路由传参? a.通配符传参数 //在定义路由的时候 { path: ' ...
- 8.MVC框架开发(URL路由配置和URL路由传参空值处理)
1.ASP.NET和MVC的路由请求处理 1)ASP.NET的处理 请求---------响应请求(HttpModule)--------处理请求(HttpHandler)--------把请求的资源 ...
- vue链接传参与路由传参
1.链接传参: 例如:链接是:http://localhost:3333/#/index?id=001 我们要获取参数:console.log(this.$route.query.id):即可 2.路 ...
- vue路由传参的三种方式区别(params,query)
最近在做一个项目涉及到列表到详情页的参数的传递,网上搜索一下路由传参,结合自己的写法找到一种适合自己的,不过也对三种写法都有了了解,在此记录一下 <ul class="table_in ...
- vue动态路由配置,vue路由传参
动态路由: 当我们很多个页面或者组件都要被很多次重复利用的时候,我们的路由都指向同一个组件,这时候从不同组件进入一个"共用"的组件,并且还要传参数,渲染不同的数据 这就要用到动态路 ...
随机推荐
- 微信小程序-scroll-view组件
<view class="section"> <view class="section__title">vertical scroll& ...
- apm飞控飞行模式详解
1.稳定模式Stabilize稳定模式是使用得最多的飞行模式,也是最基本的飞行模式,起飞和降落都应该使用此模式.此模式下,飞控会让飞行器保持稳定,是初学者进行一般飞行的首选,也是FPV第一视角飞行的最 ...
- Search Insert Position 查找给定元素在数组中的位置,若没有则返回应该在的位置
Given a sorted array and a target value, return the index if the target is found. If not, return the ...
- Oracle Merge Into的用法详解
1. MERGE INTO 的用途 MERGE INTO 是Oracle 9i以后才出现的新的功能.那这个功能 是什么呢? 简单来说,就是:“有则更新,无则插入” ...
- 查询login什么时候过期
-- Show all logins where the password is over 60 days old --查看60天没改密码的login SELECT name, LOGINPROPER ...
- laravel with嵌套的渴求式加载
今天在通过需求表A查询场地类型表B,然后通过表B的场地类型id去查询表C场地类型名的时候遇到了一个小的问题. 需求表A的字段:id.user_id .name等等: 中间表B的字段:id.appeal ...
- loadrunner测试c/s架构的应用系统
用LoadRunner测试c/s架构的软件,怎样去选择协议,困扰了我很久,看到这篇文章,感觉有点收获,所以特意转了过来,希望对大家有用. 首先,什么是协议?协议无非就是一个约定,关于数据包发送的格式的 ...
- August 13th 2017 Week 33rd Sunday
The best accessory a girl can own is confidence. 女生最好的饰品就是自信. Only when we have our own ideas and on ...
- August 11th 2017 Week 32nd Friday
I can't give you the world, but I can give you my world. 我不能给你全世界,但是我的世界我可以全部给你. Maybe I can't give ...
- [EffectiveC++]item06:若不想使用编译器自动生成的函数,就该明确决绝