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>
不足知足歡迎補充嘍~~~