1 //第一种 通过问号传参 2 //发送 3 this.props.history.push("/detail?id="+item.downurl) 4 //路由表配置 5 <Route path="/detail" component={Detail} exact></Route> 6 //接收 可以获取到?后面的方法 7 this.props.location.search 8 无弊端 刷新参数也有 9 10 11 //第二种 通过/传参 也就是动态路由!!! 12 //发送 13 this.props.history.push("/detail/"+8) 14 //路由表配置 15 <Route path="/detail/:id" component={Detail} exact></Route> 16 //接收 可以获取到关于id的一个对象 17 this.props.match.params 18 无弊端 刷新参数也有 19 20 //第三种通过对象发送跳转路由 21 this.props.history.push("/detail",{downurl:999}); 22 //路由表配置 23 <Route path="/detail" component={Detail} exact></Route> 24 //接收 可以获取到一个关于downurl的对象 25 this.props.location.state 26 弊端!!! 27 通过HashRouter设置的路由可以跳转但是访问不到参数!!! 28 29 30 //通过标签跳转加传参 31 第一种单纯的跳转不传参 32 <Link to="/main/list"><Link> 33 34 第二种传参数跳转 35 <Link to={{ 36 pathname:"/detail", 37 search:"?id=1", //获取this.props.location.search 38 state:{fromDashboard:11}//获取this.props.location.state 39 }}>跳起来啊啊啊啊 40 </Link> 41 42 //路由表配置 43 <Route path="/detail" component={Detail} exact></Route>
不足知足欢迎补充喽~~~