Búsqueda de sitios web

javascript - Wix react-native-navigation cambiar pestaña y empujar pantalla


¿Cómo puedo cambiar de pestaña y mostrar una pantalla al mismo tiempo? Cuando se presiona el botón, me gustaría cambiar a otra pestaña y mostrar una nueva pantalla. ¿Es posible?

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
          }    
       });
   }
}

Respuesta #1

Puedes cambiar la pestaña usando el siguiente código

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

y empujar usando

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

Puedes crear una función combinando estos 2 códigos. No es la mejor solución que conozco, ¡pero funciona!

Respuesta #2

No hay ninguna forma de passProps con switchToTab. también lo encontré en react-native-navigation pero no obtuve ninguna solución. cambiar de pestaña y empujar usando una variable global.

Estoy usando react-native-navigation versión 1.1.463

Cambiar de pestaña switchToTab

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

en la pestaña en el índice 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
      }
    });
}