React入門 -- todolist

React.js

2019-10-31

學習內容：

---

 

1、簡介：

　　使用的人數最多；Facebook 推出；

　　React Fiber：React16以後的版本

 

2、開發環境的搭建：

　　（1）先安裝node.js 的環境：LTS版更穩定（建議）自帶包管理工具npm

　　（2）https://reactjs.org 官網，在docs Create a New React App中找到 Create React App腳手架工具建立一個原始的react工程

 

端口：http://localhost:3000/

　　每次修改不須要重啓服務，只須要保存後在頁面上刷新 

 

 3、項目目錄分析：

 

（1）工程入口是index.js

（2）serviceWorker.js 目前用不上，忽略

（3）index.css 的效果是把頁面的邊框去掉

（4）App.test.js 是jest自動化測試工具

（5）App.js 裏render的html代碼，就是瀏覽器展現的頁面

 

4、組件：

　　html的每一個標籤，就是網頁上的一個組件。

ReactDOM：這個庫的做用是可讓咱們的組件掛載到頁面一個dom上，所以能夠發現 App.js 在定義一個react組件

　　正如index.js 中：App掛載到root dom上：

 

　　而public的靜態文檔index.html中root是一個空的div

 

 

5、JSX簡單語法：

 

　　jsx容許在div塊中直接寫js表達式，但不能寫js語句例如{ { if (true) {return 123} } }

 

6、編寫todolist功能：

　　目標：http://todolist.cn/

　　詳見我的文檔 todolist（暫時不po出）