2017-11-03 6 views
0

私はアプリを使っていますが、gobackボタンは私をバックスクリーンに連れて行っていません。goBackリアクションナビで常に家に帰る/最初の画面

App.js

import React, { Component } from 'react'; 
import one from './components/test/one'; 
import two from './components/test/two'; 
import three from './components/test/three'; 

import { DrawerNavigator } from 'react-navigation'; 

const AppNavigator = DrawerNavigator({ 
    one: { 
     screen: one, 
    }, 
    two: { 
     screen: two, 
    }, 
    three: { 
     screen: three, 
    }, 
    } 
); 

export default() => 
     <AppNavigator />; 

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

export default class one extends React.Component { 
    static navigationOptions = { 
    drawerLabel: 'one', 
    }; 

    render() { 
    return (
     <Button 
     onPress={() => this.props.navigation.navigate('two')} 
     title="Go to Two" 
     /> 
    ); 
    } 
} 

コンポーネント/試験/ two.js

three.js

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

export default class two extends React.Component { 
    static navigationOptions = { 
    drawerLabel: 'two', 
    }; 

    render() { 
    return (
     <Button 
     onPress={() => this.props.navigation.navigate('three')} 
     title="Go to 3" 
     /> 
    ); 
    } 
} 

コンポーネント/試験/ one.jsコンポーネント/試験/

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

export default class three extends React.Component { 
    static navigationOptions = { 
    drawerLabel: 'three', 
    }; 

    render() { 
    return (
     <Button 
     onPress={() => this.props.navigation.goBack()} 
     title="Go back to 2" 
     /> 
    ); 
    } 
} 

「2つに移動」=>「3に移動」=>「2に戻る」画面3の の場合、「2へ戻る」をクリックすると、いつも私をone.jsに連れて行きます。

1つのファイルにまとめても機能しません。

答えて

1

あなたが間違ったNavigator compを使用しているか、要件が不明です。基本的には、希望の動作にStackNavigatorを使用します。

catchは、DrawerNavigatorを使用してドロワーメニューを構築します。左からスワイプすると、下の画像に示すように、すべての画面を含むナビゲータードロワが表示されます。

enter image description here

あなたは以下のように画面上のボタンを追加した場合、あなたはあなたのメニューが開いて表示されます。我々は常に我々が最初の項目として定義やDrawerNavigatorの第二のparamのinitialRouteNameキーを使用して何でもある最初のルートに戻ってDrawerNavigatorを使用するとき

<Button title="MENU" onPress={() => this.props.navigation.navigate('DrawerOpen')} /> 

結論は、です。

名前が示すように、この積み重ね順をサポートしているのはStackNavigatorのみです。

あなたができることは、StackNavigatorDrawerNavigatorの画面の1つにラップすることです。例:

const AppNavigator = DrawerNavigator({ 
    drawer1: { 
     screen: drawer1, 
    } 
}); 

const drawer1 = StackNavigator({ 
    one: { screen: one }, 
    two: { screen: two }, 
    three: { screen: three }, 
}); 
+0

この回答は絶対に保存されました。 – mudcup

関連する問題