Como estoy usando react-router para manejar mis rutas en una aplicación de reacción, tengo curiosidad por saber si hay una forma de redirigir a un recurso externo.
Digamos que alguien golpea:
example.com/privacy-policy
Me gustaría que redirigir a:
example.zendesk.com/hc/en-us/articles/123456789-Privacy-Policies
Estoy encontrando exactamente cero ayuda para evitar escribirlo en JS simple en mi index.html cargando con algo como:
if ( window.location.path === "privacy-policy" ){ window.location = "example.zendesk.com/hc/en-us/articles/123456789-Privacy-Policies" }Aquí hay una línea para usar React Router para redirigir a un enlace externo:
<Route path='/privacy-policy' component={() => { window.location.href = 'https://example.com/1234'; return null; }}/>Utiliza el concepto de componente puro de React para reducir el código del componente a una sola función que, en lugar de representar cualquier cosa, redirige el navegador a una URL externa.
Funciona tanto en React Router 3 como en 4.
Con el componente Link de react-router puedes hacer eso. En el accesorio " a " puede especificar 3 tipos de datos:
Para su ejemplo (enlace externo):
https://example.zendesk.com/hc/en-us/articles/123456789-Privacy-Policies
Puedes hacer lo siguiente:
<Link to={{ pathname: "https://example.zendesk.com/hc/en-us/articles/123456789-Privacy-Policies" }} target="_blank" />También puede pasar accesorios en los que le gustaría estar, como un título, una identificación, un nombre de clase, etc.
No es necesario usar el componente <Link /> de react-router.
Si desea ir a un enlace externo, use una etiqueta de anclaje.
<a target="_blank" href="https://meetflo.zendesk.com/hc/en-us/articles/230425728-Privacy-Policies">Policies</a>