React Native - 无法解析模块

Question

在添加此问题之前，我已检查过以前的答案。不幸的是，我没有找到任何适合这个。我是React Native的初学者，我正在学习教程。我收到了这个错误。

index.android.js

import React from 'react';
import { AppRegistry } from 'react-native';
import Header from './src/components/header';

const App = () =>(
    <Header/>
);


AppRegistry.registerComponent('albums' , ()=>App);

header.js

    import React from 'react';
import { Text } from 'react-native';

const Header = () => {
  return <Text> Albums ! </Text>;
};

export default Header;

Answer 1

//import lib
import React from 'react';
import {AppRegistry,View} from 'react-native';
import Header from './src/components/Header';

// create the component
const App = () => {
  return (
              <Header />
    );
};
// render the component
AppRegistry.registerComponent('ListItem', () => App);

Header.js

import React from 'react';
import { Text } from 'react-native';

const Header = (props) => {
  return(
     <Text > Albums ! </Text>
 );
};

export default Header;

Answer 2

您提供的错误路径请更正

import Header from './src/components/Header';

用

import Header from '../src/components/Header';

Answer 3

我认为您需要将props从index.android.js传递到header.js。在原始代码中，您在header.js中设置了const Header = (props) => {，但是你没有在索引文件中传递props。

    //import lib
import React from 'react';
import {AppRegistry,View} from 'react-native';
import Header from './src/components/Header';

// create the component
const App = () => {
  return (
       <Header headerText={'Albums'} />
    );
};
// render the component
AppRegistry.registerComponent('ListItem', () => App);

header.js

import React from 'react';
import { Text } from 'react-native';

const Header = (props) => {
  return(
     <Text > {props.headerText} </Text>
 );
};
export default Header;