réagir natif - attend une classe de composants, a obtenu [objet objet]

Question

Je me suis attendu à ce qu'une classe de composant obtienne une erreur d'objet lorsque j'essaie d'utiliser le composant loginPage que j'ai créé.

voici index.ios.js

import React, {Component} from 'react';

import {
    AppRegistry,
    View
} from 'react-native';

import loginPage from './pages/loginPage'

class app extends Component {
    render() {
        return (
            <View>
                <loginPage/>
            </View>
        );
    }
}

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

et voici le loginPage.js

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

export default class loginPage extends Component {
    render() {
        return (
            <View>
                <Text>
                    Welcome to React Native!
                </Text>
            </View>
        );
    }
}

Answer 1

Vous devez renommer votre classe loginPage en LoginPage, la classe doit être en majuscule

Answer 2

loginPage.js

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

const LoginPage = () => {
    return (
        <View>
                <Text>
                    Welcome to React Native!
                </Text>
            </View>
    );
}
export default LoginPage;

index.ios.js

import React, {Component} from 'react';

import {
    AppRegistry,
    View
} from 'react-native';

import LoginPage from './pages/loginPage'

class app extends Component {
    render() {
        return (
            <View>
                <LoginPage/>
            </View>
        );
    }
}

Answer 3

supprimer les balises dans index.ios.js

import React, {Component} from 'react';

import {
    AppRegistry,
    View
} from 'react-native';

import loginPage from './pages/loginPage'

class app extends Component {
    render() {
        return (

                <loginPage/>

        );
    }
}

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