- 展示組件（也可以叫做Dumb定義：只會接收props并根據props確定渲染結果的組件
特點：復用性極高
劃分原則：我們開發一個控件，首先確定會不會被復用，只要被復用就要開發成展示組件
若果存在Dumb的子組件，那一定是Dumb組件
所有Dumb都會放在components目錄下為什么這么劃分：對于Dumb來說依賴的東西越少越好
依賴的越少復用性越高
-
容器組件（也可以叫做）定義：專門用來做數據相關的應用邏輯，拉取數據，把Dumb關聯起來，通過props傳遞給Dumb
特點：處理業務數據邏輯，調度子組件
劃分原則：容器組件我理解是倒推出來的，比如“在某個業務場景中你需要把幾個容展示組件拼湊起來，并且需要一個調度管理這幾個展示組件的角色，那么你需要一個容器組件
‘基本’不存在復用，需要和redux做連接connect，有處理異步數據操作的組件
所有smart都會放在container目錄下為什么這樣劃分：smart不用考慮太多復用性的問題，他們用是用來執行特定業務邏輯的
smart組件通常都有子組件，可為smart或Dumb
- 函數式無狀態組件（stateless function）0.14后推出的一種組件編寫方式
-
無狀態組件和純函數的結合
- 無狀態組件：內部沒有state，輸出只取決于props, context
- 純函數：相同的輸入，輸出永遠相同，沒有可觀察的任何副作用(不會更改傳入值)
接收props, context
-
const PropTypes = require('prop-types');
const Button = ({children}, context) =>
<button style={{background: context.color}}>
{children}
</button>;
Button.contextTypes = {color: PropTypes.string};
-
為什么要用
- 語法簡潔性（fb推薦理由）
- 占內小
- 首次render性能更好
- 可擴展性強（可以進行函數的compose，currying改造）
-
缺點：
- 無生命周期（不能在shouldComponentUpdate進行淺對比優化渲染）
- 沒有this
