在 react 中使用 ts 的几点原则和变化
- 所有用到jsx语法的文件都需要以tsx后缀命名
- 使用组件声明时的Component<P, S>泛型参数声明，来代替PropTypes！
- 全局变量或者自定义的window对象属性，统一在项目根下的global.d.ts中进行声明定义
- 对于项目中常用到的接口数据对象，在types/目录下定义好其结构化类型声明
React组件申明分为：类组件和函数式组件
类组件：
class App extends Component<IProps, IState> {
state: IState = {
//...
};
// 如果state很复杂不想一个个都初始化，可以结合类型断言初始化state为空对象或者只包含少数必须的值的对象,如下：
// readonly state = {} as IState;
}
- React.Component<IProps, IState>只是标注了基类的state属性类型
- 使用 class properties 语法对state做初始化时，会覆盖掉Component<P, S>中对state的readonly标识
- 而当你在子类声明state时，你可以为state标注一个【IState的子类型】作为override。这样，this.state会以子类中的state属性声明作为类型信息的来源。
//4. 建议使用函数组件，v16.7起，由于hooks的加入
函数式组件：
const List: React.FC<IProps> = props => null
建议使用函数组件：
- v16.7起，由于hooks的加入，函数式组件也可以使用state
- hooks是比HOC和render props更优雅的逻辑复用方式
- hooks（主要是useEffect）取代了生命周期的概念（减少API），让开发者的代码更加“声明化”
