TypeScript 21 React类组件与TS1 . class 组件的类型 1.1无props 、state 1.

1 . class 组件的类型

因为 class 组件里面有还有 state属性，所以共有四种情况：

1 . 1 无props 、state ：

class C1 extends React . Component {}

1 . 2 有props , 无 state ：

class C2 extends React . Component< Props >{}

1 . 3 无props , 有 state ：

class C3 extends React . Component< {} , State >{}

1 . 4 有props , 有 state ：

class C4 extends React . Component< Props , State >{}

2 . class 组件的属性和默认值

type Props = { name :string ; age? : number}
class Hello extends React . Component<Props>{
     // 属性默认值  Partial<Props>是可选的Props类型
     static defaultProps : Partial<Props> = {
         age : 18
     }
     render(){
       const  { name , age} = this . props
       return <div> ... </div>
     }
}

可以简化：在对象解构时，直接给属性默认值

2 . class 组件的状态 state 和事件

与 JS 几乎一样，除了一点， state状态声明时，加上类型。