javascript - 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。任何想法为什么？任何建议或意见将不胜感激！

标签： javascriptreact-nativenavigationreact-navigation

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)