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

127
Vistas
Empuje a nueva ruta sin más acciones en el componente

Usamos un componente externo que no controlamos que toma elementos secundarios que pueden ser otros componentes o utilizarse para enrutar a otra página. Ese componente se llama Modulation .

Así es como llamamos actualmente a ese componente de Modulation externo dentro de nuestro MyComponent .

 import React, {Fragment} from 'react';
import { withRouter } from "react-router";
import { Modulation, Type } from "external-package";

const MyComponent = ({
 router,
 Modulation,
 Type,
}) => {

 // Need to call it this way, it's how we do modulation logics.
 // So if there is match on typeA, nothing is done here.
 // if there is match on typeB perform the re routing via router push
 // match happens externally when we use this Modulation component.
 const getModulation = () => {
 return (
 <Modulation>
 <Type type="typeA"/> {/* do nothing */}

 <Type type="typeB"> {/* redirect */}
 {router.push('some.url.com')}
 </Type>
 </Modulation>
 );
 }

 React.useEffect(() => {
 getModulation();
 }, [])
 return <Fragment />;
};

export default withRouter(MyComponent);

Este MyComponent luego se llama dentro de MainComponent .

 import React, { Fragment } from 'react';
import MyComponent from '../MyComponent';
import OtherComponent1 from '../OtherComponent1';
import OtherComponent2 from '../OtherComponent2';

const MainComponent = ({
 // some props
}) => {
 return (
 <div>
 <MyComponent /> {/* this is the above component */}

 {/* We should only show/reach these components if router.push() didn't happen above */}
 <OtherComponent1 />
 <OtherComponent2 />
 </div>
 );
};

export default MainComponent;

Entonces, cuando coincidimos con el typeB , realizamos el cambio de ruta correctamente.
Pero no está limpio. OtherComponent1 y OtherComponent2 aparecen temporalmente (alrededor de 2 segundos) antes de redirigir a una página nueva.

¿Por qué? ¿Hay alguna manera de bloquearlo? Asegúrese de que si estamos ejecutando router.push('') no mostramos estos otros componentes
y simplemente redirigir limpiamente?

PD: la versión de react-router es 3.0.0

almost 4 years ago · Santiago Trujillo
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