在 react 中使用 ts 的幾點(diǎn)原則和變化
- 所有用到j(luò)sx語法的文件都需要以tsx后綴命名
- 使用組件聲明時(shí)的Component<P, S>泛型參數(shù)聲明鹿寨，來代替PropTypes赡艰！
- 全局變量或者自定義的window對(duì)象屬性笙瑟，統(tǒng)一在項(xiàng)目根下的global.d.ts中進(jìn)行聲明定義
- 對(duì)于項(xiàng)目中常用到的接口數(shù)據(jù)對(duì)象亮钦，在types/目錄下定義好其結(jié)構(gòu)化類型聲明
React組件申明分為：類組件和函數(shù)式組件
類組件：
class App extends Component<IProps, IState> {
state: IState = {
//...
};
// 如果state很復(fù)雜不想一個(gè)個(gè)都初始化盏求，可以結(jié)合類型斷言初始化state為空對(duì)象或者只包含少數(shù)必須的值的對(duì)象,如下：
// readonly state = {} as IState;
}
- React.Component<IProps, IState>只是標(biāo)注了基類的state屬性類型
- 使用 class properties 語法對(duì)state做初始化時(shí)，會(huì)覆蓋掉Component<P, S>中對(duì)state的readonly標(biāo)識(shí)
- 而當(dāng)你在子類聲明state時(shí)挫剑，你可以為state標(biāo)注一個(gè)【IState的子類型】作為override去扣。這樣，this.state會(huì)以子類中的state屬性聲明作為類型信息的來源。
//4. 建議使用函數(shù)組件愉棱，v16.7起唆铐，由于hooks的加入
函數(shù)式組件：
const List: React.FC<IProps> = props => null
建議使用函數(shù)組件：
- v16.7起，由于hooks的加入奔滑，函數(shù)式組件也可以使用state
- hooks是比HOC和render props更優(yōu)雅的邏輯復(fù)用方式
- hooks（主要是useEffect）取代了生命周期的概念（減少API）艾岂，讓開發(fā)者的代碼更加“聲明化”
