App Freezes after React Native Navigator is called

Question

i'm working on my first react native app that uses the Navigator and i have encountered an issue. Anytime i press on the <TouchableOpacity /> to make the push to the navigator, the app freezes and can't be press again.

here's my code

```

import React, { Component } from 'react';
import {AppRegistry, Navigator, Text, TouchableOpacity} from 'react-native';
import App from './src/App';
import SinglePost from './src/components/SinglePost';


class AppNavigator extends Component{

renderScene(route, navigator){
 var navProps = {navigator};
 switch (route.id) {
    case "postsList":
    console.log(route)
    return (
      <TouchableOpacity onPress={() => navigator.push({id:'yes'})}>
        <Text>Hey</Text>
      </TouchableOpacity>
    )
   case "singlePost":
    return <SinglePost title="Post"/>
   case "yes":
    console.log("yes route ",route)
    return <Text>Yes</Text>
   default:
    return <Text>Yes</Text>
   }

}

render(){
 return (
  <Navigator
    initialRoute={{id: "postsList"}}
       renderScene={this.renderScene}
      />
    )
  }
 }

AppRegistry.registerComponent('SocialMe', () => AppNavigator);


```

When I click the yes, it just freezes, any explanation for this and how can I resolve this? Thanks

You should return a component from navigator. You seem to be returning a view. — coder hacker, Feb 23 '17 at 15:35

score 2 · Accepted Answer · answered Mar 06 '17 at 06:05

2

Found the problem. I noticed that this only happens when I'm debugging Js remotely. If I disable it, then all works fine

answered Mar 06 '17 at 06:05

Kenshinman

679
8
20

Man that was frustrating! Thanks for posting this. – yarrichar Jul 31 '18 at 14:19

App Freezes after React Native Navigator is called

1 Answers1