作用：
高階元件中的withrouter, 作用是將乙個元件包裹進route裡面, 然後react-router的三個物件history, location, match就會被放進這個元件的props屬性中.
把不是通過路由切換過來的元件中，將react-router 的 history、location、match 三個物件傳入props物件上
1. 預設情況下必須是經過路由匹配渲染的元件才存在this.props，才擁有路由引數，才能使用程式設計式導航的寫法，執行this.props.history.push('/ ')跳轉到對應路由的頁面
然而不是所有元件都直接與路由相連（通過路由跳轉到此元件）的，當這些元件需要路由引數時，使用withrouter就可以給此元件傳入路由引數，此時就可以使用this.props
2. 高階元件中的withrouter, 作用是將乙個元件包裹進route裡面, 然後react-router的三個物件history, location, match就會被放進這個元件的props屬性中.此時這個元件就具備了路由的屬性
使用withrouter:
1 import from"react-router-dom";
23 import home from
"./components/home.jsx";
4 import user from
"./components/user.jsx";
56class
7constructor(props) )
10}11
render() >17"
/user
" component=>
1819
20);21}
22}23引數是乙個元件，返回乙個元件
props.history.listen()
只要是具備路由功能的元件都可以使用這個方法，引數接收乙個**函式，但是是有切換頁面時才會觸發這個方法，很像vue中的元件內的鉤子，當路由變化的時候做一些事情
props.history.listen((e) =>)
react之withRouter的作用
withrouter的作用 把不是通過路由切換過來的元件,將react router的history location和match三個物件傳入到props物件上 預設情況下必須是經過路由匹配渲染的元件才存在this.props，才擁有路由引數，才能使用程式設計式導航的寫法，執行this.props....
react的高階元件
1 什麼是高階元件？2 侵入式import react from react import loding from common loading 侵入式 因為要訪問它的內部狀態，所以要用到繼承，繼承他的父級 export default wrapcomponent else 3 非侵入式 hoc w...
React元件通訊 高階元件
子父元件通訊 非父子元件通訊 跨元件通訊 在react沒有類似vue中的事件匯流排來解決這個問題，我們只能借助它們共同的父級元件來實現，將非父子關係裝換成多維度的父子關係。react提供了contextapi來實現跨元件通訊,react 16.3之後的contextapi較之前的好用。使用流程 im...