2017-11-10 5 views
0

反応ネイティブのTabNavigatorとStackNavigatorに問題があります。ボタンを押すとナビゲーションがリセットされます。 私は自分のスタックナビゲーションをタブナビゲーションに持っています。私はad.jsにいるときTabNavigatorのリセット

-tabNavigator 
    -listing.js 
    -stackNavigator 
     -types.js 
     -picture.js 
     -ad.js 

ので、私は私がそれをクリックしたときに、私のstackNavigationリセットが入力するボタンがあります。問題は、私はちょうど1つのナビゲーション...

計画をリセットすることができるということです。 jsとtabNavigatorをList.jsに追加 私は最終的にLinsting.jsを返すつもりです。

私のナビゲーション:navigation.js

export const resetAction = NavigationActions.reset({ 
    index: 0, 
    actions: [ 
    NavigationActions.navigate({ routeName: 'Types'}), 
    ], 
    key: null 
}) 
export const listingAction = NavigationActions.navigate({ 
    routeName: 'Listing', 
    }) 


const Stack = StackNavigator(
    { 
    Types: {screen: SelectTypesScreen}, 
    Picture: {screen: SelectPictureScreen}, 
    Ad: {screen: CreateAd} 
    }) 

const Tab = TabNavigator(
    { 
    Listing: {screen: ListingScreen}, 
    Preference: {screen: PreferencesScreen}, 
    Add: {screen : Stack} 
    }, 
    { 

    } 
) 

export default class App extends Component { 
    render() { 
     return (
      <Tab /> 
    ); 
    } 
    } 

タブナビゲーションlinsting.js

export default class Listing extends Component { 
    render() { 
     return (
      <View> 
       <Text> Listing </Text> 
      </View> 
     ); 
    } 
} 

スタックナビゲーションは

export default class CreateAd extends Component { 
    render() { 
     return (
      <View> 
       <Text style={{marginTop: '80%', marginLeft: '40%'}}> Ad </Text> 
       <Button title="Ok" onPress={() => {console.log("displayer 1"), this.props.navigation.dispatch(resetAction), console.log("displayer 2"), this.props.navigation.dispatch(listingAction)}} /> 
      </View> 
     ); 
    } 
} 

答えて

0

その優れた構造を入れ子になったあなたのカーナビを変更するにad.js。ドキュメントとしての正確なやり方でうまく行く。ルートナビゲーターはstacknavigatorすることができ、あなたは

const MainScreenNavigator = TabNavigator({ 
    Recent: { screen: RecentChatsScreen }, 
    All: { screen: AllContactsScreen }, 
}); 

const SimpleApp = StackNavigator({ 
    Home: { screen: MainScreenNavigator }, 
    Chat: { screen: ChatScreen }, 
}); 

画面としてそれにTabNavigatorコンテナを追加することができますドキュメントに https://reactnavigation.org/docs/intro/nesting

+0

OK感謝を参照してくださいが、それは私の答えではありません:) –

関連する問題