react路由组件之间跳转和传值

74 阅读 0 评论 49 点赞

我是靠谱客的博主尊敬帆布鞋，最近开发中收集的这篇文章主要介绍react路由组件之间跳转和传值，觉得挺不错的，现在分享给大家，希望可以做个参考。

react路由设置中，除了标签以外，还有一个this.props.history.push，设置路由跳转和传值：

第一种方式：在父组件中，设置路由标签：

<Link to="/about/:id">About</Link>

第二种方式：在父组件中，设置点击事件：

<div onClick={this.click.bind(this)}>About</div>
//js
click(){
this.props.history.push({ pathname: "/about", state: { id } });
}

子组件中获取参数

this.props.location.state.id

this.props.history.push{
pathname:’/router/url/send’,
query:{
“oneFlag”:one,
…
}
}

this.props.location.query.oneFlag

注：query这种方式当页面刷新完之后，页面传的参数就不存在

以上就是尊敬帆布鞋为你收集整理的react路由组件之间跳转和传值的全部内容，希望文章能够帮你解决react路由组件之间跳转和传值所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供，作为学习参考使用，或来自网络收集整理，版权属于原作者所有。