Tab.Navigator -> 如何使用组件？

Posted 2023-02-23

【中文标题】Tab.Navigator -> 如何使用组件？

【英文标题】：Tab.Navigator -> How to use a component?

【发布时间】：2021-05-11 06:01:16

【问题描述】：

您好，我是 React Native 的新手，遇到一个问题：

我创建了一个新组件：

import React,  Component  from 'react';
import  View,Text  from 'react-native';

class DemoScreen extends Component 
    render()
        return(
            <View>
                <Text>Test</Text>
            </View>
        ) 
    



export default DemoScreen

我有我的应用程序并尝试了这两种方法来使用我的 DemoScreen 组件：

...
import  DemoScreen  from './DemoScreen'
...
            <NavigationContainer>
                <Tab.Navigator>
                    <Tab.Screen name="DemoScreen" component=() => <DemoScreen />/>
                    <Tab.Screen name="DemoScreen" component=DemoScreen/>                   
                </Tab.Navigator>
            </NavigationContainer>

但是他们两个都不工作，我不明白:)

错误： 错误：找不到屏幕“DemoScreen”的“组件”、“getComponent”或“儿童”道具。如果您传递了“未定义”，则可能会发生这种情况。您可能忘记从定义组件的文件中导出组件，或者在导入时混淆了默认导入和命名导入。

有人可以帮帮我吗？

谢谢！

【参考方案1】：

或在导入时混淆了默认导入和命名导入。

您正在将组件导入为命名导出...

import DemoScreen from './DemoScreen' //<--- Default Export