redux 的 react 繫結庫包含了 容器元件和展示元件相分離 的開發思想。明智的做法是只在最頂層元件（如路由操作）裡使用 redux。其餘內部元件僅僅是展示性的，所有資料都通過 props 傳入。那麼為什麼需要容器元件和展示元件相分離呢？這裡有個基本原則：容器元件僅僅做資料提取，然後渲染對應的子元件，記住這個點，trust me！
看下面這個展示列表的例子，不區分容器和展示元件的情況
// commentlist.js那麼來看下分離的情況：class commentlist extends react.component
} componentdidmount() );
}.bind(this)
});} render()
rendercomment() —;
}}
// commentlistcontainer.js這樣就做到了資料提取和渲染分離，commentlist可以復用，commentlist可以設定proptypes判斷資料的可用性class commentlistcontainer extends react.component
} componentdidmount() );
}.bind(this)
});} render()
}// commentlist.js
class commentlist extends react.component
render()
rendercomment() —;
}}
來看下容器元件和展示元件的區別:
展示元件
容器元件
關注事物的展示
關注事物如何工作
可能包含展示和容器元件，並且一般會有dom標籤和css樣式
可能包含展示和容器元件，並且不會有dom標籤和css樣式
常常允許通過this.props.children傳遞
提供資料和行為給容器元件或者展示元件
對第三方沒有任何依賴，比如store 或者 flux action
呼叫flux action 並且提供他們的**給展示元件
不要指定資料如何載入和變化
作為資料來源，通常採用較高階的元件，而不是自己寫，比如react redux的connect(), relay的createcontainer(), flux utils的container.create()
僅通過屬性獲取資料和**
很少有自己的狀態，即使有，也是自己的ui狀態
除非他們需要的自己的狀態，生命週期，或效能優化才會被寫為功能元件
優勢：
容器元件和展示元件react redux
react redux的作用是連線 connect store和容器元件的。store是redux提供的，容器元件是react提供的。容器元件 位於應用最頂層的元件，用來與redux連線的。從redux中獲取資料作為props。展示元件 位於應用的中間或者子元件，是純粹的元件，與redux沒有關係。...
react（三） 容器元件和傻瓜元件
讓乙個元件只專注於一件事，如果發現讓乙個元件做的事情太多，就可以把這個元件拆分成多個元件讓每乙個元件只專注於一件事 深入淺出react和redux 程墨 乙個react元件最基本的基本上就是完成兩大功能 1 讀取store的狀態，用於初始化元件的兩大狀態，監聽store的狀態變化 2 根據當前的pr...
react（三） 容器元件和傻瓜元件
讓乙個元件只專注於一件事，如果發現讓乙個元件做的事情太多，就可以把這個元件拆分成多個元件讓每乙個元件只專注於一件事 深入淺出react和redux 程墨 乙個react元件最基本的基本上就是完成兩大功能 1 讀取store的狀態，用於初始化元件的兩大狀態，監聽store的狀態變化 2 根據當前的pr...