javascript - Wix react-native-navigation bytt fane og skyv skjerm


Hvordan kan jeg samtidig bytte fane og pushe skjerm? Når knappen trykkes, vil jeg bytte til en annen fane og pushe en ny skjerm. Er det mulig?

class Example extends Component {
      buttonHandler = () => {
        this.props.navigator.switchToTab({
          tabIndex: 0
        });
        this.props.navigator.push({  // actually this navigator's tabIndex is 0 
          screen: "dc.Examplecreen",
          title: "Exampe", 
          passProps: {
            lesson : this.props
          }    
       });
   }
}

Svar #1

Du kan bytte fanen ved å bruke følgende kode

Navigation.mergeOptions(this.props.componentId, {
  bottomTabs: {
    currentTabId: this.props.componentId
  }
});

og push ved bruk av

Navigation.push(this.props.componentId, {
  component: {
    name: 'example.PushedScreen',
    passProps: {
      text: 'Pushed screen'
    },
    options: {
      topBar: {
        title: {
          text: 'Pushed screen title'
        }
      }
    }
  }
});

Du kan lage en funksjon som kombinerer disse 2 kodene. Ikke den beste løsningen jeg vet om, men den fungerer!

Svar #2

Det finnes ingen måte å passProps med switchToTab. Jeg fant det også i react-native-navigation men fikk ingen løsning. Bytt fane og push ved å bruke en global variabel.

jeg bruker react-native-navigation versjon 1.1.463

Bytt fane switchToTab

global.isComeFromBooking = true
this.props.navigator.switchToTab({
   tabIndex: 2,
});

i fanen på indeks 2 setOnNavigatorEvent

componentDidMount() {
    this.props.navigator.setOnNavigatorEvent((e) => {
      if (e.id == 'willAppear' && global.isComeFromBooking) {
        this.props.navigator.push({
          screen: 'Reservations',
          title: 'Bookings',
          animated: true,
          style: {
            backgroundColor: 'black',
          },
          backButtonTitle: '',
        });
        global.isComeFromBooking = false
      }
    });
}