键入 props 自定义标头反应导航

Question

我创建了一个自定义标头，并且该标头的标题是从导航参数中提取的，但是打字稿告诉我，我通过导航参数传递的属性不存在，您能否帮我输入标头属性或者如何修复这个错误。

我尝试直接输入 props，但出现另一个更复杂的错误。

这些是我的 HomeNavigator 的类型

export type HomeNavigatorTypes = {
  Home: undefined
  Cart: undefined
  SearchBusiness: undefined
  Delivery: undefined
  CreateAddress: undefined
  BusinessCategory: { category: BusinessCategories }
  Business: undefined
  SearchBusinessItems: undefined
}

.....

const HomeNavigator = createNativeStackNavigator<HomeNavigatorTypes>(); 

Answer 1

您需要为导航器创建一个类型。

首先创建一个类型文件，可能名为 NavigationTypes.d.ts。

然后创建一个像这样的类型

type HomeNavigator = {
  BusinessCategory: {category: string};
  //Other Screen names and their params. If there are no params simply use undefined
  //eg. ScreenName:undefined
 };

然后在createStackNavigator函数中分配类型。

const HomeNavigator = createStackNavigator<HomeNavigator>();

下次当您输入route.params时，您的错误将会消失。您将能够看到所有可用的参数。

注意：您不需要导入类型变量。