Typescript + Taro Ts怎么在类组件中,定义state,props,以及hook中ts的简单实用

ts在taro类组件中怎么使用定义使用state，使用方式跟在js类组件中一样，直接使用this.state.属性名，使用方式一样，

定义state稍微有点区别，在js中我们是这样定义的：

class Index extends Component {
  constructor(props) {
    super(props)
	this.state = {
	      navList: [],
	      Tjsp_flag: false,
	      topbanner_data: [], 
	      banner_data2: [], 
	      collegead_ad: [], 
	    }
	}
}

但是在ts中需要先给参数进行类型约定，不能直接给想js中那样写，
写TS像写go一样要指定一个类型 变量名:类型名,或者函数参数绑定一个接口类型声明，（Ts）例如：

interface State {
    topbanner_data: Array<any>
    hotSearchArr: Array<any>
    navList: Array<any>
    inBanner_Data: Array<any>
    midBannerCurrent: Number
    yunying_data: Array<any>
    videoad: Array<any>
    gkNews: Array<any>
    collegead_ad: Array<any>
}
interface Props{
  place: Object 
}

export default class Index extends Component<Props, State>{
  readonly state : Readonly<State> = {
    topbanner_data: [], 
    hotSearchArr: [],
    navList: [],
    inBanner_Data: [],
    midBannerCurrent: 0,
    yunying_data: [],
    videoad: [],
    gkNews: [],
    collegead_ad: [],
  };

这样就可以解决在类组件中怎么定义变量了，使用还是用this.state.属性名这样调用

hook中使用Ts

可以直接像js中那样定义变量，进行使用,系统会根据初始值自动进行类型绑定，
例如：

const [choice, setChoice] = useState(false)
setChoice(1)  // 此时会报错，choice类型初始值类型为Boolean,赋值只能为true||false
const [str, setStr] = useState('微信') // 初始值 string
setStr(1)  // 此时会报错  类型“number”的参数不能赋给类型“SetStateAction<string>”的参数
setStr("1")  // 正确写法 

// 也可以在初始化的时候先约定好类型 
 const [str, setStr] = useState<Number>('微信')  // 此时会抛出错误 类型“string”的参数不能赋给类型“Number | (() => Number)”的参数。
// 正确写法，初始值类型与前面<>里面约定的类型保持一致
 const [str, setStr] = useState<Number>(111)