```
目的：實現狀態邏輯復用
採用：包裝（裝飾）模式，比如說：手機殼
手機：獲取保護能力
手機殼：提供保護能力
高階元件：就相當於手機殼，通過包裝元件，增強元件功能
``````
高階元件：（hoc，higher-order component) 是乙個函式，接收要包裝的元件，返回增強後的元件
2.指定函式引數，引數應該以大寫字母開頭（作為要渲染的元件）
3.在函式內部建立乙個類元件，提供復用的狀態邏輯**，並返回
4.在該元件中，渲染引數元件，同時將狀態通過prop傳遞給引數元件
5.呼叫高階元件，傳入要增強的元件，通過返回值拿到增強後的元件，並將其渲染到頁面中
import img from './images/33.jpeg'
}
//監聽滑鼠移動事件
componentdidmount()
//推薦在元件解除安裝時移除事件繫結
componentwillunmount()
render()
return mouse
const position = props =>(
滑鼠當前位置：（x：,y: )
)//貓抓老師的元件
const cat = props =>(
)//獲取增強後的元件
const mouseposition = withmouse(position)
const mousecat = withmouse(cat))}
原因：預設情況下，react 使用元件名稱作為displayname
解決方法：為高階元件 設定 displayname 便於除錯時區分不同的元件
作用：用於設定除錯資訊（react developer tools資訊）
React元件通訊 高階元件
子父元件通訊 非父子元件通訊 跨元件通訊 在react沒有類似vue中的事件匯流排來解決這個問題，我們只能借助它們共同的父級元件來實現，將非父子關係裝換成多維度的父子關係。react提供了contextapi來實現跨元件通訊,react 16.3之後的contextapi較之前的好用。使用流程 im...
高階元件 高階函式 一
antd裡面的form表單方面，遇到乙個高階函式，以及高階元件，於是看了一下這方面內容，前輩們的文章寫得也非常詳細，這裡就稍微kobe一下 高階函式與高階元件 高階函式 高階函式，是一種特別的函式，接受的引數為函式，返回值也是函式 成立條件，二者兼一即可 1 一類特別的函式 a 接受函式型別的引數 ...
React高階元件
想想以前用原生和jquery的專案，上千行的code映入眼簾，瞬間有種昏死過去的衝動。難以維護，改乙個bug可能出現n個bug，真的是很痛苦。於是乎元件化成為了當前前端開發的主流技術。angular vue和react很好的幫我們實現了元件化。但是我們常常也會遇到一種情況，就是兩個元件往往有很多的重...