2016-10-27 12 views
5

Mam Router konfigurację ze scenami kartę 2:react-native-router-flux: Jak zapobiec resetowaniu historii kart Tab przy zmianie kart?

  • Tab 1: mają 2 żeglownych sceny (ekrany statyczne);
    • ekranu A: mieć przycisk do nawigowania na sita B;
    • Ekran B: po prostu tekst;
  • Zakładka 2: ma tylko 1 ekran statyczny.
    • Ekran C: po prostu tekst;

Kod jest następujący.

app.js:

import React from 'react'; 
import { Router, Scene } from 'react-native-router-flux'; 
import Tab from '../tab'; 
import ScreenA from './a'; 
import ScreenB from './b'; 
import ScreenC from './c'; 


export default class App extends React.Component { 
    render(){ 
    return (
     <Router> 
     <Scene key="root"> 
      <Scene key="tabbar" tabs={true}> 

      <Scene key="tab1" title="Tab 1" icon={Tab}> 
       <Scene key="a" title="Screen A" component={ScreenA} /> 
       <Scene key="b" title="Screen B" component={ScreenB} /> 
      </Scene> 

      <Scene key="tab2" title="Tab 2" icon={Tab}> 
       <Scene key="c" title="Screen C" component={ScreenC} /> 
      </Scene> 

      </Scene> 
     </Scene> 
     </Router> 
    ); 
    } 
} 

Ekrany są dość proste, zbyt.

a.js:

export default class ScreenA extends React.Component { 
    render(){ 
    return (
     <View> 
     <Text>This is Screen A</Text> 
     <TouchableHighlight onPress={() => Actions.b()}> 
      <Text>Go to Screen B</Text> 
     </TouchableHighlight> 
     </View> 
    ); 
    } 
} 

b.js:

export default class ScreenB extends React.Component { 
    render(){ 
    return (
     <View> 
     <Text>This is Screen B</Text> 
     </View> 
    ); 
    } 
} 

c.js:

export default class ScreenC extends React.Component { 
    render(){ 
    return (
     <View> 
     <Text>This is Screen C</Text> 
     </View> 
    ); 
    } 
} 

przypadek użycia:

  • Aplikacja odtwarza ekran A (w Tab. 1);
  • Kliknij przycisk na ekranie A: aplikacja przechodzi do ekranu Ekran B (nadal w Tab. 1);
  • Kliknij zakładkę 2: aplikacja przechodzi do ekranu Ekran C (w Tab. 2).
  • Kliknij na Tab 1: aplikacja przechodzi do Ekran A (w Tab 1) i NOT na ekranie B, zgodnie z oczekiwaniami.

react-native-router-flux nie zatrzymuje stosu historii kart, gdy do nich wrócimy. Czy robię coś złego tutaj?

Pakiety wersje:

  • reagować v15.3.2
  • reakcji natywne v0.34.1
  • reakcji natywne router strumień v3.36.0

Odpowiedz

3

Okazuje się, że jest to błąd w reakcji natywne router strumień opakowania i to naprawiono w tym pull request.

+1

Jak ustawić nawigację aplikacji na ekranie A zamiast ekranu B po kliknięciu linku do karty 1 od środka karty 2? –