React native a l'écran vide

Question

Je suis nouveau à réagir-native, et j'essaye d'utiliser un navigateur pour basculer entre les différentes scènes. Cependant, quand le simulateur tourne, au lieu d'imprimer une erreur, je viens d'avoir un écran blanc vide, vide, qui ne montre rien à la pile restante, à l'heure et au signal wifi. J'ai vérifié mon code plusieurs fois et ne peux pas trouver une erreur. Quelqu'un peut-il m'aider à ce sujet?

Ceci est mon fichier index.ios.js:

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

import Chatroom from './Views/Chatroom'; 
import Chat from './Views/Chat'; 

class goals extends Component{ 
    render(){ 
    return(
     <Navigator 
     initialRoute={{screen: 'Chatroom'}} 
    renderScene={(route, nav) => {return this.renderScene(route.screen)}} 
    /> 
) 
    } 

    renderScene(route,nav) { 
switch (route.screen) { 
    case 'Chatroom': 
    return <Chatroom navigator={nav} /> 
    case 'Chat': 
    return <Chat navigator={nav} /> 
     } 
    } 
} 

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

Ceci est mon fichier Chat.js:

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

export default class Chat extends Component { 
    render() { 
    return (
     <View> 
     <Text>This is chat</Text> 
     <TouchableHighlight onPress={this.gochatroom.bind(this)}> 
      <Text>Go to chatroom</Text> 
     </TouchableHighlight> 
     </View> 
    ) 
    } 


    gochatroom() { 
    this.props.navigator.push({ screen: 'Chatroom' }); 
    } 
} 

Ceci est mon fichier Chatroom.js:

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

export default class Chatroom extends Component { 
    render() { 
    return (
     <View> 
     <Text>This is chatroom</Text> 
     <TouchableHighlight onPress={this.gochat.bind(this)}> 
      <Text>Go to chat</Text> 
     </TouchableHighlight> 
     </View> 
    ) 
    } 


    gochat() { 
    this.props.navigator.push({ screen: 'Chat' }); 
    } 
} 

Answer 1

Vous ne transmettez pas les bons arguments à renderScene. Ce qui suit devrait fonctionner mieux:

renderScene={(route, nav) => this.renderScene(route, nav)}