네이티브 응답 오류: 요소 유형이 잘못되었습니다. 문자열 또는 클래스/함수가 필요한데: 개체를 받았습니다.

네이티브 응답 오류: 요소 유형이 잘못되었습니다. 문자열 또는 클래스/함수가 필요한데: 개체를 받았습니다.

이 에러가 발생하고 있어, 수정에 많은 어려움을 겪고 있습니다.

여기서 하려고 하는 것은, 3개의 다른 화면과 각각의 화면으로 이동하는 탭바가 있는 것입니다.

내 인덱스는 다음과 같습니다.

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

import Nav from './app/components/Nav';
import Screen from './app/Screen';

import Tabs from 'react-native-tabs'

import SwitchView from './SwitchView';

class Proj extends Component {

constructor(props){
    super(props);
}

render(){
    var x = "FeedView";
    return(

          <View style={styles.container}>
            <Tabs selected={x} style={{backgroundColor:'white'}}
                  selectedStyle={{color:'red'}} onSelect={el=> {x = el.props.name}}>
                <Text name="FeedView">First</Text>
                <Text name="WikiView" selectedIconStyle={{borderTopWidth:2,borderTopColor:'red'}}>Second</Text>
                <Text name="BoardView">Third</Text>
            </Tabs>

            <SwitchView id={x}/>

          </View>
    );
}
}

const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
welcome: {
fontSize: 20,
textAlign: 'center',
margin: 10,
},
instructions: {
textAlign: 'center',
color: '#333333',
marginBottom: 5,
},
})

AppRegistry.registerComponent('Proj', () => Proj);

SwitchView는 다음과 같습니다.

import Feed from './app/pages/Feed/Feed';
import Board from './app/pages/Board';
import Wiki from './app/pages/Wiki';

class SwitchView extends Component {
render(){
    var { id } = this.props;

    switch (id) {
        case "FeedView":
            return <Feed/>
        case "WikiView":
            return <Wiki/>
        case "BoardView":
            return <Board/>
    }
}
}

이 문제는 프로그램의 일부 JS 모듈 내보내기/가져오기 문제로 인해 발생할 수 있습니다.일반적으로 다음 두 가지 이유 중 하나입니다.

• 내보내는 것을 잊었거나 잘못 내보냈습니다.
• 존재하지 않는 것을 가져오거나 잘못 가져왔습니다.

오류가 저 .export, 에 야기되는 but but but but but but butimport , , , , , , , , , , 을 했습니다.import모듈에 존재하지 않는 것을 Import하려면 스테이트먼트가 올바르지 않습니다.

경우에는 ★★★★★★★★★★★★★★★★★★★★★★★★★★★.import.

import { MyComponent } from './MyComponents/MyComponent'

실제로는 다음과 같습니다.

import MyComponent from './MyComponents/MyComponent'

그리고 그것은 나를 미치게 했고 그것을 알아내는 데 하루 종일 걸렸고, 나는 이것이 몇몇 사람들에게 몇 시간을 절약해주기를 바란다.

SwitchView 정의를 다음과 같이 변경합니다.

export default class SwitchView extends Component...

SwitchView를 다음과 같이 변경합니다.

import Feed from './app/pages/Feed/Feed';
import Board from './app/pages/Board';
import Wiki from './app/pages/Wiki';
export default class SwitchView extends Component {
render(){
    var { id } = this.props;

    switch (id) {
        case "FeedView":
            return <Feed/>
        case "WikiView":
            return <Wiki/>
        case "BoardView":
            return <Board/>
    }
}
}

설치된 패키지에 대해서만 이 문제에 직면했습니다.이전에 썼던 이름

import WebView from 'react-native-webview-messaging/WebView';

로 바꿨습니다.

import { WebView } from 'react-native-webview-messaging/WebView';

이 문제에 직면했습니다.

import {ErrorMessage} from '../Components/ErrorMessage';

다음과 같이 쓰는 대신:

import ErrorMessage from '../Components/ErrorMessage';

.0.46.4 걸 먹었는데import MainContainer from './app'서, 「」는app.index.js는 Android와 Native는 Android iOS를 .index.js에 inside inside inside appimport MainContainer from './app/index.js'효과가 있었어요

이 오류는 Defualt를 사용하여 해결할 수 있습니다.

내보내기 대신 내보내기 기본값 사용

제 경우, 문제는 'AppLoading'의 잘못된 npm 설치였습니다."컴포넌트 예외:반응 탐색 사용 중 요소 유형이 잘못되었습니다."이 오류 아래에 'App'의 렌더링 방법을 확인하기 위한 조언문이 있습니다.'AppLoading'을 제대로 설치하지 못했습니다.다음에, 다음과 같이 인스톨 합니다.

expo install expo-app-loading

다음으로 앱 로드 Import를 로 변경했습니다.

import AppLoading from "expo-app-loading";

[메모: 반드시 다음 정보를 확인합니다]<AppLoading /> prop onError prop]를 포함해야 합니다.이러한 간단한 변경으로 제 앱은 예상대로 작동하기 시작했습니다.

내 경우 반응 탐색 및 반응 탐색/추첨기의 버전을 확인하여 오류를 해결합니다.

@react-navigation version 5와 @react-navigation/drawer version 6을 사용하고 있었는데 이것이 문제의 원인이었습니다.

버전 6을 삭제하고 @react-navigation/drawer 버전5를 설치했더니 문제가 해결되었습니다.

모든 내비게이션/스택 및 드로어를 최신 버전으로 업데이트해야 하는 것과 같은 문제에 직면해 있었습니다.

나는 이 문제에 직면했다.

import Something from '@library';

로 변경했습니다.

import { Something } from '@library';

반시

고객님의 에러에 따라 컴포넌트가 무효라고 하는 것과 같은 문제를 처리했습니다.SwitchView에서는 이 컴포넌트를 오브젝트 체크 아웃으로 반송합니다.

이 힌트가 도움이 되었기를 바랍니다.스택오버플로우는 처음이라 answer 탭에 익숙하지 않습니다.감사합니다:)

module.view = SwitchView와 어떻게 다릅니까?

module.exports는 1개를 제외한 모든 js 파일에 대해 작동합니다.

이 문제는 프로그램의 일부 JS 모듈 내보내기/가져오기 문제로 인해 발생할 수 있습니다.일반적으로 다음 두 가지 이유 중 하나입니다.

1. 내보내는 것을 잊었거나 잘못 내보냈습니다.
2. 존재하지 않는 것을 가져오거나 잘못 가져왔습니다.

비슷한 오류가 있었습니다만, 제 경우는 수출 때문이 아니라 수입에 의한 것입니다.모듈에 없는 것을 Import하기 위해 Import 명세서를 잘못 사용했습니다.

이 오류는 내보내지 않은 구성 요소에 액세스하려고 할 때 발생합니다.제 경우 컴포넌트를 내보내는 것을 잊어버려서 접속하고 있었습니다.

내 경우엔 내가 교체했다.

const App: () => React$Node = () => {

app.에서 다음 행으로 이동합니다.

const App = () => {

나한테도 먹혔어쨌든

Inn My Case에서 raffce 명령어를 구현했는데 App.js를 내보내는 것을 잊어버렸습니다.

const App = () =>  {
  return (
    <NavigationContainer theme={theme}>
      <Stack.Navigator screenOptions={{ headerShown : false}} initialRouteName="Home">
        <Stack.Screen name='Home' component={Home}/>
        <Stack.Screen name='Details' component={Details}/>
      </Stack.Navigator>
    </NavigationContainer>
  );
}

그 후 Export를 추가하지 않은 것을 깨달았습니다.그리고 내 코드를 이렇게 바꿨더니 작동했어

const App = () =>  {
  return (
    <NavigationContainer theme={theme}>
      <Stack.Navigator screenOptions={{ headerShown : false}} initialRouteName="Home">
        <Stack.Screen name='Home' component={Home}/>
        <Stack.Screen name='Details' component={Details}/>
      </Stack.Navigator>
    </NavigationContainer>
  );
}

export default App;

언급URL : https://stackoverflow.com/questions/37620473/react-native-error-element-type-is-invalid-expected-a-string-or-a-class-functi