［譯］Smart and Dumb Components

mist14 發布于2019-08-19 17:11 / 483人閱讀

摘要：我把這兩大類稱作和，但是我也聽說他們被稱為和和和等。雖然叫法不同，但核心思想都差不多它必須能獨立運作。。不能依賴依賴這個的或者部分可以允許有這樣的話有助于這個組件有修改彈性接受數據和數據的改變只能通過來處理不必也不能用。

Smart and Dumb Components

原文地址

當我在寫React應用的時候我發現一種老有用而且簡單的寫法了。要是你寫了一段時間React的話。。我估摸著你也應該發現了這種寫法了。這篇文章（下次我就翻譯這片文章）就說的很好，但是捏，我還想多差兩句嘴

你要是把你的組件分成兩大類。。你將會發現，這樣的話你更容易思考你的組件該怎么寫。。而你的組件寫出來也更容易復用。我把這兩大類稱作 Smart和 Dumb，但是我也聽說他們被稱為Fat 和 Skinny, Stateful 和 Pure, Screens 和 Components等。雖然叫法不同，但核心思想都差不多

Dumb components:

-它必須能獨立運作。。不能依賴依賴這個app的actions 或者 stores 部分

可以允許有this.props.children,這樣的話有助于這個組件有修改彈性

接受數據和數據的改變只能通過props來處理,不必也不能用state。

組件的外觀能用一個css來維護(這樣才更容易重用，類似支付寶的ant)

很少用到state,(一般呈現動畫的時候可能會用到。。比如控制下拉框的展開或者收起)

也許會用到其他的dumb components

比如說: Page, Sidebar, Story, UserInfo, List,像這些都是dumb components.

smart components:

一定包含至少一個Smart 或者 Dumb的元件，（這肯定啊。。不然他干的啥）

負責把從flux(or redux等)接收到的state傳給dumb component

負責call action,并把它的callback傳給dumb component

它應該只有結構沒有外觀（這樣的話。。改個樣式只需要改dumb 組件就好了。。他寫著。。他寫那里不然很累啊）

比如說: UserPage, FollowersSidebar, StoryContainer,
FollowedUserList.

這樣做的好處

有助理你分離關注點，這樣的話更有助于理解你的app的業務邏輯和它的ui

更有助于復用你的dumb組件，你可以將你的dumb組件復用于別的state下，而且這兩個state還完全不同

本質上dumb 組件其實就是你的app的調色版。。你可以將它們放到一個頁面上。。然后讓設計師除了app的業務邏輯，樣式隨便怎么改，

GPU云服務器云服務器 Dumb Components styled-components web-components

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/78269.html

[譯]看這些文章，足夠你學好redux

摘要：原文地址我想分享一些文章，來幫你學習的概念和架構在開始之前我們先來看這兩篇文章，用代替和然后我們通過一個代碼教程我翻譯地址深入了解，然后看一看超級介紹完成你對的探索之旅現在是時候去學習和再往前走理解并且看一看關于的一切注盡量中文地址的我用的原文地址我想分享一些文章，來幫你學習redux的概念和架構在開始redux之前我們先來看這兩篇文章，用High Order Component...

fengxiuping 2019-08-19 17:17 評論0 收藏0
(翻譯)Presentational and Container Components

摘要：對于很多中間組件來說，他們并不需要這些，但是他們還必須傳遞給下一級組件。更傾向于，而更傾向于，當然這并不是絕對的。這是篇文章翻譯自的這是篇文章翻譯自medium的：Presentational and Container Components 譯者語：這篇文章是緊接著對我上一篇翻譯的擴充，對Container Component模式描述的更加細，解決了我很多開發中的困惑。 Prese...

mushang 2019-08-22 11:02 評論0 收藏0
看redux的一些筆記

摘要：不只為組件提供中的數據及擴展方法，它還為定義的組件添加了一系列事件操作，這些事件的核心點就是，然后可以在自己定義的組件內獲得。行為功能是對目的功能和有用行為的一種抽象。下一個中間件函數通常由名為的變量來表示。 redux 這個是好久之前寫的，一直忘記粘過來，里面有一些是寫作格式是我自己定義的，所以和segmentfault的markdown語法有出入，圖片也不能加載，所以原文效果可以在...

el09xccxy 2019-08-21 11:39 評論0 收藏0
[譯] Python 學習 —— __init__() 方法 4

摘要：同時，有多個類級別的靜態構造函數的方法。這個累贅，無論如何，是被傳遞到每個單獨的對象構造函數表達式中。我們可能只有幾個特定的擔憂，提供額外關鍵字參數給構造函數。注：原書作者 Steven F. Lott，原書名為 Mastering Object-oriented Python 沒有__init__()的無狀態對象下面這個示例，是一個簡化去掉了__init__()的類。這是一個常見...

yvonne 2019-07-31 11:38 評論0 收藏0
面試官：了解Fuzzing Test嗎？

摘要：產生的崩潰測試用例可能難以分析，因為模糊測試的行為并不能告訴你關于軟件內部運行方式的知識。模糊測試向軟件系統提供隨機輸入。軟件質量保障專注測試圈，自動化測試、測試平臺開發、測試新技術、大廠測試崗面經分享，可以幫忙內推BATJ等大廠！歡迎加VX溝通交流: ISTE1024 測試同...

shusen 2021-11-15 11:37 評論0 收藏0