React-Native: не могу найти переменную компонента.

Question

Я пытаюсь настроить систему навигации.Использование реагирует на навигационные API , но при этом возникает проблема «Не удается найти компонентную переменную.».То, что я сделал, это ...

App.js

import React, {Component} from 'react';
import {createSwitchNavigator, createAppContainer} from 'react-navigation';
import WelcomeScreen from './src/screens/Welcome';
import DashboardScreen from './src/screens/Dashboard';

const appSwitchNavigation = createSwitchNavigator({
  Welcome:{ screen: WelcomeScreen },
  Dashboard:{ screen: DashboardScreen }
});

const AppContainer = createAppContainer(appSwitchNavigation);

class App extends Component {
  render() {
    return <AppContainer/>
  }
}

export default App

Welcome.js

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

export default class WelcomeScreen extends Component {
    render() {
        return (
            <View style={styles.container}>
                <Text style={styles.welcome}>Welcome</Text>
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#F5FCFF',
    },
});

Любойзнаете почему я сталкиваюсь с этой ошибкой?И это структура файла:

Answer 1

Кажется, что в App.js и Welcome.js отсутствует импорт компонента из'act ':

import React, { Component } from 'react'

Или вы можете использовать:

class App extends React.Component

Answer 2

Вы забыли импортировать Компонент

import React, { Component } from 'react';

Правильный код:

App.js

import React,{ Component } from 'react';
import {createSwitchNavigator, createAppContainer} from 'react-navigation';
import WelcomeScreen from './src/screens/Welcome';
import DashboardScreen from './src/screens/Dashboard';

const appSwitchNavigation = createSwitchNavigator({
  Welcome:{ screen: WelcomeScreen },
  Dashboard:{ screen: DashboardScreen }
});

const AppContainer = createAppContainer(appSwitchNavigation);

class App extends Component {
  render() {
    return <AppContainer/>
  }
}

export default App

WelcomeScreen.js

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

export default class WelcomeScreen extends Component {
    render() {
        return (
            <View style={styles.container}>
                <Text style={styles.welcome}>Welcome</Text>
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#F5FCFF',
    },
});