Reactネイティブナビゲーションが機能していません

Question

反応ネイティブナビゲーションを使用して2つの画面間を移動しようとしていますhttps://reactnavigation.org/。それはEnableNotification.jsにindex.jsから取り組んでいるが、それはCreateMessage.js

EnableNotification.js

/** 
* https://github.com/facebook/react-native 
* @flow 
*/ 

import React, { Component } from "react"; 
import { View, Text, Image, Button, StyleSheet } from "react-native"; 
import { StackNavigator } from "react-navigation"; 
import styles from "./Styles"; 
import * as strings from "./Strings"; 
import CreateMessage from "./CreateMessage"; 

export default class EnableNotificationScreen extends Component { 
    render() { 
    const { navigate } = this.props.navigation; 
    return (
     <View style={styles.container}> 
     <Image source={require("./img/enable_notification.png")} /> 
     <Text style={styles.textStyle}> {strings.enable_notification} </Text> 
     <View style={{ width: 240, marginTop: 30 }}> 
      <Button 
      title="ENABLE NOTIFICATION" 
      color="#FE434C" 
      onPress={() => navigate("CreateMessage")} 
      style={{ borderRadius: 40 }} 
      /> 
     </View> 
     <Text 
      style={{ 
      textAlign: "center", 
      marginTop: 10 
      }} 
     > 
      NOT NOW 
     </Text> 
     </View> 
    ); 
    } 
} 

const ScheduledApp = StackNavigator({ 
    CreateMessage: { 
    screen: CreateMessage, 
    navigationOptions: { 
     header: { 
     visible: false 
     } 
    } 
    } 
}); 

CreateMessage.js

import React, { Component } from "react"; 
import { View, Text, Image, Button, StyleSheet } from "react-native"; 

export default class CreateMessage extends Component { 
    render() { 
    return <View><Text>Hello World!</Text></View>; 
    } 
} 

Answer 1

これは私のために働いた - CreateMessageコンポーネントは、あなたが受け取っているメッセージ_ _errorどのような種類のthis.props.navigator.navigate(<name>)

Answer 2

まずへEnableNotification.jsから動作していない：

index.android.js又はindex.ios.jsその後

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

import Index from './app/Index'; 
import CreateMessage from './app/CreateMessage'; 
import EnableNotification from './app/EnableNotification'; 

render() { 
return (
    <Navigator 
    initialRoute={{screen: 'Index'}} 
    renderScene={(route, nav) => {return this.renderScene(route, nav)}} 
    /> 
) 
} 

renderScene(route,nav) { 
switch (route.screen) { 
    case "Index": 
    return <Index navigator={nav} /> 
    case "EnableNotification": 
    return <EnableNotification navigator={nav} /> 
    case "CreateMessage": 
    return <CreateMessage navigator={nav} /> 
} 
} 

：

index.js最後

goEnableNotification() { 
    this.props.navigator.push({ screen: 'EnableNotification' }); 
    } 

：

EnableNotification .js

goCreateMessage() { 
    this.props.navigator.push({ screen: 'CreateMessage' }); 
    } 

あなたが戻りたい場合は、関数GOBACKを行うには：

goBack() { 
    this.props.navigator.pop(); 
} 

私は、これはあなたを助けることを願っています！