React路由传参

1.params方式 

  优点：刷新地址栏参数依然存在

  缺点：只能传字符串，传递参数过多时地址栏URL会很长

// 路由配置
<Route path='/user/:id' component={User}/>
// 使用link跳转
<link to="/user/1001">xxx</Link>
// 使用js跳转
this.props.history.push({pathname: '/user/' + id})
// 获取传递的参数
this.props.match.params.name

2.query方式

   优点：可以传对象

   缺点：刷新页面，参数不存在

// 路由配置
<Route path='/user' component={User}/>
// 使用link跳转
<Link to={{ path: "/user", query: {id: "1001"}}}>
// 使用js跳转
this.props.history.push({pathname:'/user',query: { id : '1001' }})
// 获取传递的参数
this.props.location.query.id

 

　

转载于:https://www.cnblogs.com/jmwei/p/10942425.html