前端三大主流框架之一 React
React
React是Facebook開發的一款JS庫，其更注重於檢視層。
React不是一個MVC框架，它是一個構造可組合式使用者介面的庫。它鼓勵建立可重用的UI元件顯示會隨著時間而改變的資料。
如果你是一個新手，你可以選擇直接引入方法
安裝步驟
1、下載需要引入的檔案
第一步：建立一個資料夾(名字必須是英文)，開啟cmd 輸入全域性命令 npm install bower -g
第二步：輸入 bower install react 如果你需要指定的版本 可輸入 bower install react #15.6.1
第三步：輸入 bower install babel
2、引入檔案
建立一個html模板如下程式碼
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <script src="bower_components/react/react.js"></script> <script src="bower_components/react/react-dom.js"></script> <script src="bower_components/babel/browser.js"></script> </head> <body> <div id="app"> </div> <script type="text/babel"> </script> </body> </html>
上面程式碼有兩個地方需要注意。
首先，最後一個 <script> 標籤的 type 屬性為 text/babel 。這是因為 React 獨有的 JSX 語法，跟 JavaScript 不相容。凡是使用 JSX 的地方，都要加上 type="text/babel" 。
其次，上面程式碼一共用了三個庫： react.js 、react-dom.js 和 Browser.js ，它們必須按順序依次引入。其中，react.js 是 React 的核心庫，react-dom.js 是提供與 DOM 相關的功能，Browser.js 的作用是將 JSX 語法轉為 JavaScript 語法。
ReactDOM.render()
ReactDOM.render 是 React 的最基本方法，用於將模板轉為 HTML 語言，並插入指定的 DOM 節點。
ReactDOM.render(
<div>
<h1>i love you !</h1>
</div>,
document.getElementById("app")
)JSX 語法（以下程式碼包含jsx語法）
HTML 語言直接寫在 JavaScript 語言之中，不加任何引號，它允許 HTML 與 JavaScript 的混寫。
JSX 的基本語法規則：遇到 HTML 標籤（以 < 開頭），就用 HTML 規則解析；遇到程式碼塊（以 { 開頭），就用 JavaScript 規則解析
可用let宣告程式碼如下
let tag = <div><div>hollo</div><span>word</span></div>
ReactDOM.render(
<div>
<h2>{tag}</h2>
</div>,
document.getElementById("app")
)多選框單選框預設選中且可以更改 input框書寫預設值可更改
ReactDOM.render(
<div>
<input type='text' defaultValue='pug'/>
<input type='radio' name='s' defaultChecked />
<input type='radio' name='s' defaultChecked />
<input type='checkbox' defaultChecked />
</div>,
document.getElementById("app")
)以上程式碼需注意 在預設選中或更改時需新增default 且後面的屬性第一個字母要大寫 其遵循小駝峰命名規則
如果想要了解駝峰命名規則，點選我