最近公司項(xiàng)目用到了react+ts來寫項(xiàng)目，我感覺項(xiàng)目用上ts以后確實(shí)方便了很多枷邪，可能有的會(huì)認(rèn)為要定義interface很麻煩仑鸥，但是前期的麻煩，為了后期的方便維護(hù)鹰服，倒也沒事,話不多說直接開始
1.關(guān)于使用useMemo和useCallBack的時(shí)候
基本上useMemo和useCallBack大家應(yīng)該都使用過病瞳，其實(shí)這兩個(gè)方法可能很大程度上便于我們操作數(shù)據(jù)以及數(shù)據(jù)的變動(dòng)，但是初用者記得一定要講useMemo和useCallback中的依賴拋出悲酷，這樣能最大程度的避免數(shù)據(jù)渲染問題時(shí)套菜，焦頭爛額的排錯(cuò)
2.關(guān)于設(shè)置數(shù)據(jù)初始值時(shí)候，頁面報(bào)錯(cuò)的問題
這個(gè)問題其實(shí)在于我們代碼風(fēng)格有關(guān)设易，我直接舉個(gè)例子吧
const [list,setList] = useState<IUseList>({})
但是我們可能聲明類型IUseList時(shí)候里面的一些參數(shù)可能并沒有加上? 這時(shí)候可能導(dǎo)致我們還需要初始定義逗柴，所以這時(shí)候我們可以使用一個(gè)參數(shù)
const [list,setList] = useState<Partial<IUseList> >({})
但是這種情況我們還是視情況而定
還有一種情況就是我們頁面渲染的時(shí)候初始值的問題
<span>{list}<span>?
這時(shí)候可能如果后臺(tái)數(shù)據(jù)沒有次參數(shù)的話，可能頁面就會(huì)直接報(bào)錯(cuò)顿肺，所以我們可以在賦值的時(shí)候給定一個(gè)空值
<span>{list || {}}<span>?
3.關(guān)于使用react中使用redux-toolkit的一些問題
鏈接：redux-toolki
其實(shí)我感覺toolkit使用起來方便倒是挺方便的戏溺，但是可能文件下都要寫一個(gè)action和slice文件來管理組件的redux數(shù)據(jù)屋摔，對于中大型項(xiàng)目來說還是蠻適用的谱仪，
接下來說一下使用中需要注意的問題，我們一般用到的話都會(huì)在項(xiàng)目中首先createSlice來創(chuàng)建我們的redux-toolkit汹族，這里需要區(qū)別的就是reducers和extraReducers
reducers：我們使用中比較常見的是后臺(tái)管理系統(tǒng)的頂部搜索讼昆，點(diǎn)擊搜索的方法我們可以放入reducers里面
extraReducers：這里面的操作其實(shí)和promise一樣分為pending 托享，fulfiled和rejected，基本上我們在這三個(gè)動(dòng)作里面可以進(jìn)行數(shù)據(jù)的操作以及轉(zhuǎn)換
其實(shí)官方文檔說明的蠻清楚了浸赫，雖然是英文的闰围，但是看里面的方法就好，比較通俗易懂的
4.關(guān)于在react中使用antd+ts的一些問題
其實(shí)react和antd還是滿搭配的既峡，無論是里面的方法還是組件的運(yùn)動(dòng)我覺得都是極其不錯(cuò)的羡榴，下面說一下在表單中比較容易碰到的問題
1.form表單的運(yùn)用在后臺(tái)管理系統(tǒng)其實(shí)是很常見的，里面比如說有一些復(fù)選框啊下拉框什么的运敢，我們其實(shí)單獨(dú)在form表單中的onValuesChange事件中去使用檢測到數(shù)據(jù)的變動(dòng)炕矮，這樣就不用去每個(gè)里面寫一個(gè)onchange事件了么夫，onValuesChange里面會(huì)返回兩個(gè)參數(shù)一個(gè)是values，一個(gè)是allValues肤视，具體我們需要用到哪個(gè)數(shù)據(jù)档痪，看我們的場景來定義吧，然后就是搭配到onFinish事件去提交和修改表單的數(shù)據(jù)
2.如果項(xiàng)目中使用eslint檢測的話邢滑，我們在運(yùn)用一些組件的onchange事件的時(shí)候我們通常不知道怎么去定義這個(gè)value值腐螟，這時(shí)候我們可以去官方的git連接里面找到使用文件的demo，就可以看到官方定義的ts類型困后，省的我們不知道什么類型就隨便用個(gè)any乐纸，導(dǎo)致項(xiàng)目中增加warnings
