Fauzan Elka
Fauzan Elka

Reputation: 21

The component for route 'Example' must be a react component

So I have a rootstack navigation from react-navigation

I have a folder Markets with index.js like this:

import ExampleOne from './ExampleOne';
import ExampleTwo from './ExampleTwo';
import ExampleThree from './ExampleThree';
import ExampleFour from './ExampleFour';
import ExampleFive from './ExampleFive';

export { 
    ExampleOne,
    ExampleTwo,
    ExampleThree,
    ExampleFour,
    ExampleFive
};

with ExampleOne.js to ExampleFive.js like this:

import React, { Component } from 'react';
import { Container, Content, Text } from 'native-base';

export default class ExampleOne extends Component {
  render() {
    return (
      <Container>
        <Content>
          <Text>Example</Text>
        </Content>
      </Container>
    )
  }
};

But when I importing it to RootStack.js, I got an error "The Component for route 'ExampleOne' must be a React Component.'

RoutStack.js like this:

import React from 'react';
import { createStackNavigator } from 'react-navigation';

// Import all MarketsScreen
import { ExampleOne, ExampleTwo, ExampleThree, ExampleFour, ExampleFive } from './Markets';

const RootStack = createStackNavigator({
    ExampleOne: ExampleOne,
    ExampleTwo, ExampleTwo,
    ExampleThree: ExampleThree,
    ExampleFour: ExampleFour,
    ExampleFive: ExampleFive
});

export default RootStack;

Is there anything wrong with my code? I'm following some tutorial but it's not work on me

Upvotes: 0

Views: 792

Answers (1)

SebastianDiaz13
SebastianDiaz13

Reputation: 11

try to call the resources ExampleOne, ExampleTwo..etc, should not use the object {ExampleTwo} .. is unnecessary ..

Upvotes: 1

Related Questions