form 重點

1、controlled component(下稱cc) and uncontrolled component(下稱ucc):

cc與ucc是描述元素是否在react控制之下

例如一般情況下 input元素維護自己的狀態，使用者輸入什麼，它就顯示什麼，我們可以透過value屬性在任何時間點向它取值

但當一個input元素是透過react render出來的，並且有賦於它value屬性，而我們又希望能在使用者keyin內容時掌控state並在特定元素上顯示，所以我們會設定一個eventhandler去監控input內容，並呼叫setState方法改變狀態，setState方法會呼叫render方法更新畫面，這時因為我們有賦於value屬性值，在重新render時等同重置內容，此時這個input便不在是自我控制，而是受react控制，所以稱之為cc，cc與ucc是對於react而言

如果我們希望cc的input元素之value值能依使用者輸入而改變，只要將value屬性值與元件的state狀態連結即可，render方法的return內容會是像下列這樣

<input type="text" onChange={handleUserInput} value={this.state.userInput} />

handleUserInput方法中會呼叫setState方法更新元件的userInput狀態

jsx input元素的value值則和userInput狀態連結

如此一來，便將一個input元素轉換為受控的react input元素

或是換個方式說，在react環境下當我們想要設定有value屬性的元素(例如input)的value初始值，同時希望能用setState方法記錄狀態，又希望能正常反映使用者的輸入內容時(否則會在setState呼叫render方法時重置為初始值，無法正常反映輸入內容)，就必須這樣操作，像是把它納入react控制，所以稱之為cc，有value屬性的元素不多，有value屬性又有上述需求的元件就更少，所以大部份的元件都是ucc類型

不想轉換為cc但又想設定初始值的方式:
用以下列屬性替代value屬性設定始初值
defaultValue (for input, select元素)
defaultChecked (for checkbox, radio)


2、form的用途是讓使用者輸入資料，一般方式是使用form元素搭配submit元素，在點擊submit時一次性傳送整個form元素裡面的資料

但是在react有很不一樣的處理方式，它是在使用者輸入每一個字元時都傳輸資料(有變化的部份)，所以你可以不需要一個submit按鈕，甚至也不需要一個form元素，僅僅只需要一個input元素即可讓使用者提交資 料

當然你還是會使用form元素和submit按鍵，例如在表單輸入過程中即時比對輸入內容與server端資料並做相應的處理，然後使用者按下送出的動作做為一種確認方式，區分"進行中"與"已完成"，但在某些情況下，僅僅只需要簡單的input元素即可滿足需求