react-navigation with TypeScript

 import { createStackNavigator,StackNavigationProp } from '@react-navigation/stack'; 

为了对路由名和参数进行类型检查，首先要创建带有路由名到其参数的映射的对象类型

index.js

export type stackParamsList={
    BottomTab:{
        screen?:string
    };
    Detail:{
        id:number
    };
}

 export type navigationProp=StackNavigationProp<stackParamsList> 导出

这将为Navigator和Screen组件提供类型检查和intelliSense。

 const Stack=createStackNavigator<stackParamsList>() 

注释 navigation prop

import  { navigationProp } from '@/navigator/index'
interface Iprops{
    navigation:navigationProp
}

注释route prop

import { RouteProp } from '@react-navigation/native';
import {stackParamsList} from '@/navigator/index'
type  routeProp=RouteProp<stackParamsList,'Detail'>
interface Iprops{
    route:routeProp
}