容器型元件（container component）
展示型元件（presentational component）
把網路請求 + 列表展示的元件拆分成以上的容器型元件 + 展示型元件：
在容器元件中訪問網路，有結果之後執行setstate，在render中使用展示型元件，網路請求來的列表通過propos傳遞給展示型元件。
展示型元件中僅僅獲取propos來展示資料，而沒有state（無狀態元件，所以展示型元件可以用function來建立）
以上完成了元件的初步拆分。但是可能有多個元件中都有非同步請求，所以必須把非同步請求從元件中獨立抽取出來，在容器元件上多抽出來一層專門處理非同步請求的網路元件。
這個網路元件或稱為高階元件，用於增強元件。實現過程：採用屬性劫持。乙個函式接收乙個元件a，返回另乙個元件b。b的props接收乙個promise，didmount中對這個promise進行**註冊（ps：這裡可能需要看一下下面的promise解釋），有結果後進行setstate，render中呼叫a，props傳入網路資料，到了a中直接獲取資料展示即可。
總結以上過程：
第一次抽取：把元件中的網路請求與展示邏輯拆分，分為container和list元件
補充以上的promise解釋：
對於乙個狀態已經變化完畢的promise，後續任何時候對這個promise進行函式註冊，都會馬上被執行，而且可以多次執行，下面**輸出兩個ok
var p = new promise(function(resolve,reject));
settimeout(
function
());
},100);
settimeout(
function
());
},1000);
react父子元件傳值 react元件通訊
react元件之間的通訊，其實就是通過乙個props建立彼此之間的橋梁，而我們最常用的就是父子傳值，子父傳值，以及兄弟之間傳值 1 父元件給子元件傳值 父元件給子元件傳值相對比較簡單，如果想讓他們倆之間有所聯絡，想傳遞父元件的資料，那麼我們就在父級元件中的子元件標籤上定義乙個屬性，而屬性的值就是我們...
React高階元件
想想以前用原生和jquery的專案，上千行的code映入眼簾，瞬間有種昏死過去的衝動。難以維護，改乙個bug可能出現n個bug，真的是很痛苦。於是乎元件化成為了當前前端開發的主流技術。angular vue和react很好的幫我們實現了元件化。但是我們常常也會遇到一種情況，就是兩個元件往往有很多的重...
React基礎 元件
元件從概念上看就像是函式，它可以接收任意的輸入值 稱之為 props 並返回乙個需要在頁面上展示的react元素。class welcome extends react.component class welcome extends react.component const element sar...