javascript - Wix react-native-navigation byta flik och trycka på skärm


Hur kan jag samtidigt byta flik och visa en ny skärm? När knappen trycks vill jag byta till en annan flik och visa en ny skärm. Är det möjligt?

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 byta flik med följande kod

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

och tryck med

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

Du kan skapa en funktion som kombinerar dessa två koder. Inte den bästa lösningen jag vet, men den fungerar!

Svar #2

Det finns inget sätt att passProps med switchToTab. Jag hittade det också i react-native-navigation men fick ingen lösning. Byt flik och tryck med hjälp av en global variabel.

jag använder react-native-navigation version 1.1.463

Byt flik switchToTab

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

i fliken på index 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
      }
    });
}