「要素タイプが無効です」というエラーが表示されるのはなぜですか？

Question

error私は私のiOSシミュレータになっている私には意味がありません。私のHome.jsコンポーネントは私にとってはうまく見えます。私はこのエラーがどのようになっているのか理解できません。私は明らかにコンポーネントをエクスポートしました。どうすればこのエラーを取り除くことができますか？

はここHome.jsです：ここで

import React from 'react'; 
import View from 'native-base'; 
import MapView from 'react-native-maps'; 
import styles from './MapContainerStyles'; 

export const MapContainer = ({region}) => { 
    return(
     <View style={styles.container}> 
      <MapView 
       provider={MapView.PROVIDER_GOOGLE} 
       style={styles.map} 
       region={region} 
      > 
      </MapView> 
     </View> 
    ); 
} 

errorです：：

は

import React from 'react'; 
import Container from 'native-base'; 
import {MapContainer} from "../../../components/MapContainer/index"; 

class Home extends React.Component { 

    componentDidMount() { 
     this.props.setName(); 
    } 

    render() { 
     const region = { 
      latitude: 3.146642, 
      longitude: 101.695845, 
      latitudeDelta: 0.8922, 
      longitudeDelta: 0.0421 
     } 
     return(
      <Container> 
       <MapContainer region={region}/> 
      </Container> 
     ); 
    } 
} 

export default Home; 

ここindex.jsだ

Element type is invalid: expected a string (for built-in components) or 
a class/function (for composite components) but got: undefined. You 
likely forgot to export your component from the file it's defined in. 

Check the render method of 'Home'. 

Answer 1

MapContainerに2回のエクスポートがあります。

あなたはトップexport const MapContainer

で、このいずれかを持っていて、一番下にこれを持っています。 export default MapContainer;

これで1つを取り除く必要がありますが、保存したものは後でどのようにインポートするかが決まります。

デフォルトの輸出を続ける場合は、あなたがすることを試みたので

import {MapContainer} from "../../../components/MapContainer/index";

Answer 2

あなたが持っている、ここで2つのエクスポート

import React from 'react'; 
import View from 'native-base'; 
import MapView from 'react-native-maps'; 
import styles from './MapContainerStyles'; 

//delete export from the next line 
export const MapContainer = ({region}) => { 
    return(
     <View style={styles.container}> 
      <MapView 
       provider={MapView.PROVIDER_GOOGLE} 
       style={styles.map} 
       region={region} 
      > 
      </MapView> 
     </View> 
    ); 

} 

export default MapContainer;