gpt4 book ai didi

reactjs - react native TabNavigator 不显示

转载 作者:行者123 更新时间:2023-12-02 03:40:17 25 4
gpt4 key购买 nike

我创建了一个基本的 react-native 应用程序,它由几个用于呈现不同屏幕的按钮组成。用户登录后,我呈现了一个 TabNavigator 项目,但由于某种原因,没有出现任何选项卡,屏幕完全空白。我没有任何运气就将我的代码与其他人进行了比较。有什么建议吗?

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

import {Electric} from './Sub-bills/Electric';
import {Web} from './Sub-bills/WebBill';
import {Water} from './Sub-bills/Water';
import {OtherBills} from './Sub-bills/OtherBills';
import {Personal} from './Sub-bills/Personal';

export const Tabs = TabNavigator(
{
Electric: {
screen: Electric,
navigationOptions: {
tabBarLabel: 'Electric'
}
},
Web: {
screen: Web,
navigationOptions: {
tabBarLabel: 'Web'
}
},
Water: {
screen: Water,
navigationOptions: {
tabBarLabel: 'Water'
}
},
OtherBills: {
screen: OtherBills,
navigationOptions: {
tabBarLabel: 'Other'
}
},
Personal: {
screen: Personal,
navigationOptions: {
tabBarLabel: 'Personal'
}
}
},
);

export class HouseholdBills extends React.Component{
render(){
return (
<Tabs />
);
}
}

const styles = StyleSheet.create({
container: {
width: '100%',
height: '100%',
backgroundColor:'transparent',
justifyContent: 'center',
alignItems: 'center',
position: 'absolute'
},
});

一个组件通过按下一个按钮来渲染

最佳答案

在新版本的 ReactNavigation 中,将 TabNavigator 放在 SafeAreaView 下会导致它不显示,因为 React Navigation 已经在处理它,

如果在您的情况下,您在 TabNavigator 之上使用 SafeAreaView 组件,也许删除它会对您有所帮助。

关于reactjs - react native TabNavigator 不显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48855137/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com