如何在另一个React组件中使用createBottomTabNavigator [关闭]

Question

我正在将旧的react-native项目更新为一个新项目，我正在获取

不变违规：此导航器缺少导航道具......

现在错了。但我不知道如何在最新的反应导航版本中的另一个组件中使用createBottomTabNavigator。

任何帮助表示赞赏！

renderModel() {
  return (
    <View>
      <Text>Dummy Sample</Text>
      <GeoResult /> // this is createBottomTabNavigator.
    </View>
  )
}

Answer 1

这是我在React Component中实现createBottomTabNavigator的示例

注意：我正在使用react-navigation version 3.3.0

import { createBottomTabNavigator, createAppContainer } from 'react-navigation'
import FirstTab from './tabs/FirstTab';
import SecondTab from './tabs/SecondTab';
import ThirdTab from './tabs/ThirdTab';
import FourthTab from './tabs/FourthTab';
import FifthTab from './tabs/FifthTab'
const BottomTabNav = createBottomTabNavigator(
  {
    FirstTab,
    SecondTab,
    ThirdTab,
    FourthTab,
    FifthTab
  },
  {
    initialRouteName: 'FirstTab',
  }
);

export default createAppContainer(BottomTabNav);

在渲染：

      render() {
    return (
      <View style={{flex:1, backgroundColor: 'white'}}>

        <Text style={{paddingTop:20}}>Text on the Top of BottomTab Navigator</Text>

        <BottomTabNav/> 

      </View>

    )
  }
}

输出图像：