小编Dai*_*vdM的帖子

反应导航 route.params 打字稿

我正在使用 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

3
推荐指数
3
解决办法
5845
查看次数