我正在使用 TypeScript 创建一个由 Expo 管理的 React Native 应用程序,并且在 React Navigation 和 TypeScript 方面遇到了一些问题。
我想为 Tab.Screen 组件上的底部选项卡导航器指定图标。
这段代码可以工作,但会抱怨,因为 route.params 可能是未定义的(第 10 行)。
类型“对象”上不存在属性“图标”
我可以在 initialParams 上制作所需的图标道具吗?
我在没有任何运气的情况下查看了文档。
const App: React.FC<{}> = () => {
return (
<SafeAreaView style={styles.container}>
<NavigationContainer>
<Tab.Navigator
screenOptions={({ route }) => ({
tabBarIcon: ({ size, color }) => (
<MaterialIcons
size={size}
/* ===> */ name={route.params.icon}
color={color}
/>
),
})}
>
<Tab.Screen
name="EventListView"
initialParams={{ icon: 'view-agenda' }}
component={EventListScreen}
/>
<Tab.Screen
name="CreateEvent"
initialParams={{ icon: 'public' }}
component={SettingsScreen}
/>
</Tab.Navigator>
</NavigationContainer> …Run Code Online (Sandbox Code Playgroud) typescript reactjs react-native react-navigation react-navigation-bottom-tab