課程大綱：

React Hooks培訓

課程對 React Hooks 的鉤子函數做了全方位的分析，并且對舊的 Class 寫法和新的 Hooks 寫法在生命周期上進行對比。

課程除了介紹 Hooks 之外，還會通過純 Hooks 函數組件的方式對 CNode 門戶網站進行移動端頁面的重構，

實戰過程中會介紹一些真實開發用到的一些技術棧。

1 React 簡介
2 useState
3 useContext
4 useMemo
5 自定義 Hooks
6 移動端適配
7 函數組件
8 useEffect
9 useReducer
10 useRef
11 Antd-Mobile
12 Hooks CNode 實戰

1
課程介紹及開發環境搭建

1.ReactHooks的由來 2.Hooks和Class兩種寫法對比 3.搭建開發環境

2
useState 方法介紹及使用實例

1.如何聲明、讀取和修改變量

2.為什么通過ES6解構的形式獲取useState的返回值

3.useState在使用上的一些坑

4.手寫簡單的useState方法

3
useEffect 代替了哪些生命周期

1.DidMount、DidUpdate的Hook寫法

2.WillReceiveProps的Hook寫法

3.聲明多個useEffect

4.useEffect書寫小技巧

5.useEffect性能優勢

4
useContext 組件間的傳值

1.useContext使用時機

2.useContext寫法優勢

3.useContext性能分析

5
useReducer 代替 Redux

1.useReducer基礎概念

2.useReducer使用

3.useReducer的優勢

4.實現類Redux小實戰

6
使用 useMemo 提高代碼性能

1.什么時候會寫出有性能問題的代碼

2.memo如何解決性能問題

3.useMemo如何解決性能問題

4.useCallback如何解決性能問題

7
useRef 的使用

1.介紹useRef

2.useRef使用技巧

3.父子組件間的ref傳值

8
手寫屬于自己的 use 函數

1.修改title鉤子函數

2.監聽頁面大變化小鉤子函數

3.簡化input輸入框鉤子函數

9
實戰開發環境搭建

1.createreactapp初始化項目

2.引入AntdMobile樣式庫

3.vw實現移動端的適配

4.axios請求庫二次封裝

5.引入路由機制

10
CNode 移動端網站開發

1.整理cnode項目的接口文檔

2.公用頭部

3.首頁

4.詳情頁