前言
說起React，那也是近一年多時(shí)間火起來的前端框架，其在Facebook的影響力和大力推廣下，已然成為目前前端界的中流砥柱。在如今的前端框架界，React、Vue、Angular三分天下的時(shí)代已經(jīng)到來，而曾經(jīng)jQuery一統(tǒng)天下的局面已一去不復(fù)返。
三分天下，前端雖亂，但美其名曰“繁榮”。每一次突破性的革命必定會(huì)迎來成千上萬的追隨者，我們可以看一下一份來自NPM的統(tǒng)計(jì)數(shù)據(jù)：
上圖統(tǒng)計(jì)的是全球范圍內(nèi)React、Vue、Angular在npm中的月下載次數(shù)，統(tǒng)計(jì)地址可以訪問：npm-stat。從圖中我們不難發(fā)現(xiàn)React雖初出茅廬，但其影響力已經(jīng)奠定了在前端框架中的霸主地位。
而對于React的開發(fā)者來說，如何利用React構(gòu)建現(xiàn)代化的前端項(xiàng)目，產(chǎn)出高質(zhì)量的前端代碼才是學(xué)習(xí)React的重點(diǎn)。所以本文就我自己平時(shí)利用React開發(fā)項(xiàng)目的經(jīng)驗(yàn)和個(gè)人見解，來談?wù)勗赗eact項(xiàng)目中需要了解和容易忽略的“小事”。
那些小事
俗話說“千里之堤毀于蟻穴”，在React開發(fā)中我們不能忙于進(jìn)度而忽視了細(xì)節(jié)。
1.使用容器組件與展示組件
容器組件和展示組件名詞來自于redux文檔。如果你想讓自己的React項(xiàng)目變得清晰可維護(hù)，那么你需要了解并使用它們。
這里我們將組件分成兩類，一類叫“容器組件”，我一般將它們放在containers文件夾下。這一類組件可以理解為最頂層的組件，其功能僅僅做數(shù)據(jù)提取，然后渲染對應(yīng)的子組件。
另一類叫“展示組件”，我一般將它們放在components文件夾下。這一類組件可以理解為只具有展示性的子組件，其功能僅僅是展示性的，所有數(shù)據(jù)都通過 props 傳入。
這樣分類的好處在于：關(guān)注分離，更易復(fù)用及維護(hù)，數(shù)據(jù)集中處理等。具體可以參見：譯文《容器組件和展示組件》
