反應導航（TabNavigator）不起作用

我在使用React Navigation時遇到TabNavigator的問題，而不是看到第一個屏幕（歡迎屏幕）並看到屏幕底部的標籤導航器，只有一個空屏幕。反應導航（TabNavigator）不起作用

我這樣做：「故宮安裝--save反應導航」在該項目中。我做錯了什麼？

import React from 'react'; 
import { StyleSheet, Text, View } from 'react-native'; 
import { TabNavigator, StackNavigator } from 'react-navigation'; 

import AuthScreen from './screens/AuthScreen'; 
import WelcomeScreen from './screens/WelcomeScreen'; 


export default class App extends React.Component { 
    render() { 
    const MainNavigator = TabNavigator({ 
     welcome: { screen: WelcomeScreen }, 
     auth: { screen: AuthScreen} 
    }); 


    return (
     <View style={styles.container}> 

      <MainNavigator/> 
     </View> 
    ); 
    } 
} 

const styles = StyleSheet.create({ 
    container: { 
    flex: 1, 
    backgroundColor: '#fff', 
    alignItems: 'center', 
    justifyContent: 'center', 
    }, 
});

來源

2017-09-23 Lucky_girl

嘗試只返回MainNavigator而不是用額外視圖進行包裝。 –

謝謝@EdgarAroutiounian，它現在正常運作！你可以寫一個答案，所以我可以在Stackoverflow中接受它。 –

返回MainNavigator而不是包裝一個額外的視圖，也我建議不需要在渲染中反覆。你可能甚至不需要這個包裝React組件。

來源

2017-09-23 19:18:27

你做的唯一的錯誤是你一個包裹裏面查看你MainNaviagtor，所以刪除在主導航頂部的wrappper。

你不需要包裝你的主路由器組件在任何標記。

你不需要在naviagators周圍看到一個包裝。我希望這可以解決您的問題，如果不讓我知道:)

來源

2017-09-23 19:02:22

你的代碼是好的，你可以用主導航到一個容器視圖。爲了您將來可以在容器視圖中添加更多組件，實際問題與容器樣式有關。通過刪除alignItems和JustifyContent屬性來更改樣式，如下所示：

const styles = StyleSheet.create({ 
    container: { 
    flex: 1, 
    backgroundColor: '#fff' 
    } 
})

它會解決此問題。我爲我嘗試了它的工作原理。

https://repl.it/L6S8/0

來源

2017-09-23 19:51:34 Sanjeev

反應導航（TabNavigator）不起作用

回答

相關問題