react中智慧型元件和木偶元件

2021-08-09 15:45:05 字數 353 閱讀 6869

智慧型元件和木偶元件,又叫做:

smart and dumb components

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

你要是把你的元件分成兩大類。。你將會發現,這樣的話你更容易思考你的元件該怎麼寫。。而你的元件寫出來也更容易復用。我把這兩大類稱作 smart和 dumb,但是我也聽說他們被稱為fat 和 skinny, stateful 和 pure, screens 和 components等。雖然叫法不同,但核心思想都差不多

dumb components:

React中的受控元件和非受控元件

資料繫結在表單標籤上,必須繫結state的值,不能是普通的值 然後需要實現表單的change事件,在事件中接收ev,獲得表單的value值 ev.target.value 將接收到的value值設定給state上,state變了,介面就會變 constructor render 獲取 changea...

React中的受控元件和非受控元件

官方對於受控元件和非受控元件的描述 受控元件 如上述這樣寫會報錯的,如果用狀態去控制輸入框,這樣是沒有辦法去控制輸入框輸入的值,是輸入不了內容的,要配合乙個onchange事件來控制這輸入框的值 糾正錯誤的 constructor handlechange e render onchange typ...

React中建立元件

1.第一種建立元件的方式 使用建構函式來建立元件,如果要接收外界傳遞的資料,需要在建構函式的引數列表中使用props來接收 必須要向外return乙個合法的jsx建立的虛擬dom 建立元件 注意 元件首字母必須要大寫,否則就會被當作乙個普通標籤來渲染,瀏覽器就識別不了報錯 function hell...