找不到模块-在app.js中添加组件时

Question

我正在使用React Native。以下是我在app.js中的代码。

import React, { useState } from 'react';
import { StyleSheet, Text, View } from 'react-native';
import Header from './components/Header';

export default function App() { 
    return (
        <View>
        </View>
    );
}

我在根目录中创建了另一个目录，并添加了另一个js文件Header.js。它包含以下代码。

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

export default function Header() {
    return (    
        <View>
        </View>
    );
}

我在下面收到一条错误消息。

  

开发服务器返回响应错误代码：500

     

找不到模块./components/Header

目录结构

如果需要更多信息，请告诉我。

Answer 1

将Header组件替换为此：-

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

const Header = ({props}) => {  // you can also access props like this 
return (    
    <View>
    </View>
);
}

Answer 2

应该是

const Header = () => {
    return (    
        <View>
        </View>
    );
}

export default Header

不仅要重新加载应用程序，还要重新启动打包程序。

Answer 3

请更正您的功能标头组件为：

const Header = () => {
return(
<View>.............</View>
)}

export default Header

然后运行 react-native start 和 react-native run-android