inProgress-team / react-native-meteor

Meteor Reactivity for your React Native application :)
MIT License
693 stars 210 forks source link

Element type is invalid: expected a string (for built-in components) on react-native #201

Open valentinancy opened 7 years ago

valentinancy commented 7 years ago
import React from 'react'
import { Text, View, ScrollView, AppRegistry, } from 'react-native'
import { Link, nativeHistory, Route, Router, withRouter, StackRoute, } from 'react-router-native'

const Master = (props) => (
  <View>
    {props.children}
  </View>
)

const Home = () => {
  const Menu = ({ page,text }) => (
    <Link to={`/${encodeURIComponent(page)}`}>
      <View style={{ flex: 1 }}></View>
    </Link>
  )

  return (
    <ScrollView>
      <Menu page="news" text="Latest News Page"/>
      <Menu page="fixtures" text="Fixtures & Result"/>
      <Menu page="teammate" text="Teammate Photos"/>
      <Menu page="rugby101" text="Rugby 101"/>
      <Menu page="rugbyclubs" text="Rugby Clubs"/>
    </ScrollView>
  )
}

const MenuPage = withRouter((props) => {
  const { routeParams } = props
  const page = routeParams.page
  const text = routeParams.text

  return(
    <Text>This will be {text}</Text>
  )
})

const routes = (
  <Router history={ nativeHistory } /*addressBar*/>
    <StackRoute path="master" component={ Master }>
      <Route path="/" component={ Home }/>
      <Route path="/:page" component={ MenuPage }/>
    </StackRoute>
  </Router> 
)

AppRegistry.registerComponent('Last', () => routes)
JulianKingman commented 7 years ago

I think routes should be a function, no? e.g.

const routes = () => (
  {...}
)
darrenfurr commented 7 years ago

I had this same issue with: RN 0.41.2 & react-native-meteor 1.0.3.

Discovered that an app.json had been created in the project (somehow) causing this error on componentDidMount in the RN code.

Once I deleted the app.json - app ran without issue.