react-navigation 如何在 createAppContainer 中嵌套 TapNavigator

Question

嗨，我正在尝试将 createMaterialTopTabNavigator 嵌套在 createAppContainer 中，但给我一个错误，我有 duplicate declaration App 下面是我的代码：

import { createAppContainer, createMaterialTopTabNavigator } from 'react-navigation';
import { createMaterialBottomTabNavigator } from 'react-navigation-material-bottom-tabs';

export default class App extends Component {
  render(){
    return(
      <SafeAreaView style={{flex:1}}>
        <AppTabNavigator/>
      </SafeAreaView>
    )
  }
}

class HomeScreen extends Component {
  render(){
    return(
      <View>
        <Text>HomeScreen</Text>
      </View>
      )
  }
}

class SettingsScreen extends Component {
  render(){
    return(
      <View>
        <Text>SettingsScreen</Text>
      </View>
      )
  }
}

const AppTabNavigator = createMaterialTopTabNavigator({
  Home:{screen:HomeScreen},
  Settings:{ screen: SettingsScreen}
  })

const App = createAppContainer(AppTabNavigator)

这会给我一个错误，我有重复的App。任何想法为什么？ 任何建议或 cmets 将不胜感激！

Answer 1

我想通了。我犯了一个愚蠢的错误。应该是这样的：

export default class App extends Component {
  render(){
    return(
      <SafeAreaView style={{flex:1}}>
        <AppContainer />
      </SafeAreaView>
    )
  }
}

const AppTabNavigator = createMaterialTopTabNavigator({
  Home:{screen:HomeScreen},
  Settings:{ screen: SettingsScreen}
  })

const AppContainer = createAppContainer(AppTabNavigator)