Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

315
Vistas
¿Cuál es la mejor manera de configurar los parámetros de navegación antes de configurar las opciones de navegación mediante setOptions?

Quiero saber cuál es la mejor manera de configurar los parámetros y las opciones para reaccionar con la navegación nativa en un componente de clase. tenga en cuenta que los mismos parámetros se utilizan en las opciones. cuando puse todo el código en el constructor, obtuve parámetros undefined debido a un problema de tiempo. y funciona. para mí en un caso cuando agregué la opción en componentDidMount , escribiré algunos ejemplos en el código a continuación.

1- primer caso usando el componente de clase (está funcionando)

 type Props = { navigation: NavigationProp<any>; route: RouteProps<{ Example: {title: string} }, 'Example'> } export default class Example extends Component <Props> { constructor(props: Props){ super(props) this.props.navigation.setParams({ title: 'title' }); } componentDidMount(){ this.props.navigation.setOptions({ title: this.props.route.params.title }) } ... }

2 - segundo caso usando FC: (no uso este ejemplo, pero creo que también es la mejor manera de hacerlo para FC).

 export function Example: React.FC = () => { const navigation = useNavigation(); const route = useRoute(); useLayoutEffect(()=>{ navigation.setParams({ title: 'title' }); navigation.setOptions({ title: route.params.title }) }) ... }

así que espero que mi pregunta sea clara, ¿es esa la forma correcta de configurar las opciones de encabezado con la última navegación en React Native?

about 4 years ago · Santiago Trujillo
1 Respuestas
Responde la pregunta

0

constructor es el primer paso en el ciclo de vida del componente , y está configurando parámetros dentro de eso, lo que significa que hay una propiedad que se actualizará. por lo que necesitamos una función que entienda cada actualización en un estado o accesorios recibidos, y ese oyente no es más que "componentDidUpdate(){}" 🤟:

 import {NavigationProp, RouteProp} from '@react-navigation/native'; import React, {Component} from 'react'; import {Text, StyleSheet, View} from 'react-native'; type Props = { navigation: NavigationProp<any>; route: RouteProp<{Example: {title: string}}, 'Example'>; }; export default class Example extends Component<Props> { constructor(props: Props) { super(props); this.props.navigation.setParams({title: 'title'}); } componentDidUpdate() { this.props.navigation.setOptions({title: this.props.route.params.title}); } render() { return ( <View style={styles.container}> <Text style={styles.textStyle}>Use component did update :)</Text> </View> ); } } const styles = StyleSheet.create({ container: { padding: 30, }, textStyle: { color: 'black', fontSize: 20, fontWeight: 'bold', }, });

ingrese la descripción de la imagen aquí

about 4 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda