一、React的特點 1、自動化的UI狀態管理：自動完成數據變化與界面效果的更新。 2、虛擬DOM：創建1個虛擬的dom節點樹，放在記憶體里（記憶體修改數據效率高），數據變化時先修改記憶體里的虛擬DOM，然後與頁面的DOM進行對比，React可以做優化，優化後可只修改變化的部分，縮小節點更改的範圍，從而提 ...
一、React的特點
1、自動化的UI狀態管理：自動完成數據變化與界面效果的更新。
2、虛擬DOM：創建1個虛擬的dom節點樹，放在記憶體里（記憶體修改數據效率高），數據變化時先修改記憶體里的虛擬DOM，然後與頁面的DOM進行對比，React可以做優化，優化後可只修改變化的部分，縮小節點更改的範圍，從而提高效率。（正常情況下改變節點後要重新渲染頁面，效率慢）。
3、組件化開發：管理頁面的各功能，將1個功能視為1個組件。每個組件都可以有各自的結構、樣式、行為，然後把所有的組件拼合起來的開發方式。單頁應用的實現方式。
4、完全在js中定義UI：一個組件就是1個js。
5、JSX：JavaScript XML。使React的標簽寫法像html那樣來編寫
6、只是MVC構架中的V：MVC是一種架構模式，model（模型：獲取數據）→ view（視圖：渲染）→controller（控制器：關聯數據與視圖）。
7、單向數據流：只能父級傳子級，便於追蹤數據的來源。
二、創建一個React應用
1、引入兩個React的線上js文件：
<script crossorigin src="js/react.development.js"></script> <script crossorigin src="js/react-dom.development.js"></script>
2、使用：
①渲染到頁面：ReactDOM.render();
②創建元素：React.createElement()
- 參數1：元素名
- 參數2：元素屬性，格式為JSON。多個單詞用駝峰命名，class屬性要寫成className
- 參數3：標簽內容，可以是文本，也可以是另一個元素對象。
3、JSX語法
①引入JSX編譯器 babel.min.js ，然後在script里寫入type值為text/babel，讓瀏覽器認為該代碼為JSX代碼。但是該方法編譯速度很慢，效率低。
②JSX規則與XML一致：
- 允許嵌套
- 標簽必須嚴格閉合
- 屬性：
- 大部分屬性和HTML標簽一致
- 兩個特殊：for→htmlFor class→className
- 可以自定義屬性
- 引用變數必須用 {}花括弧，花括弧中可做運算
- 引用組件用<>尖括弧
- 註釋，{/*註釋*/} ，要加花括弧
- style屬性要寫成花括弧形式，如：style={{color:"red"}};
三、React的組件
1、組件是編寫React應用的基礎，一個應用就是由大大小小的組件組合而成。
2、組件分類：
- 無狀態組件：普通函數定義，無狀態，沒有生命周期，能夠優化性能。
- 有狀態組件：推薦ES6語法定義，React內部會創建實例，並擁有完整的生命周期。
