.js路由跳轉：

1.被Route包裹的組件，直接this.props.history.push("/xx")；

在構造函數中

constructor(props) {
　　super(props);
}

2.普通組件可通過使用withRouter(組件)再this.props.history.push("/xx")

import React from "react";
import {withRouter} from "react-router-dom";

class MyComponent extends React.Component {
  ...
  myFunction() {
    
 
this.props.history.push("/some/Path");
  }
  ...
}
export default withRouter(MyComponent);

常規導入

import React from ‘react‘

import { BrowserRouter as Router,Route,Link} from ‘react-router-dom‘

註意BrowserRouter只能有一個孩子，

switch用於重定向孩子為Route或者redirect

---從上向下匹配，只匹配它的第一個孩子

1.url帶參數/參數

<Route path="/:id">

參數獲取:this.props.match.params.id

2.帶參數跳轉該地址

<Link to={{

pathname:‘/home‘ 路徑名,

query:‘‘ 參數值

state:‘‘ 參數值保存在state中

}}

a.query傳參 this.props.location.query.xx 貌似刷新後該參數狀態不會保存

b.state傳參 this.props.location.state.xx

被Route包裹的組件會有location，match,history等屬性，通過this.props獲取即可

<Route path=‘/xx‘ component={組件}

若組件中又有子組件，父組件可屬性方式將history等傳遞給子組件，子組件通過this.props獲取

匹配：

使用 exact 關鍵字會精確匹配到該路由下，否則則匹配到滿足該路由的路由下。

react-router-dom