Preguntas etiquetadas con react-router

Según tengo entendido, <Route path="/" component={App} />will da Appaccesorios relacionados con el enrutamiento como locationy params. Si mi Appcomponente tiene muchos componentes secundarios anidados, ¿cómo consigo que el componente secundario tenga acceso a estos accesorios sin: pasando accesorios de la aplicación usando el objeto de la ventana crear rutas para …

85 javascript  reactjs  react-router 

Tengo un enrutador como el siguiente: <Router history={hashHistory}> <Route path="/" component={App}> <IndexRoute component={Index}/> <Route path="login" component={Login}/> </Route> </Router> Esto es lo que quiero lograr: Redirigir al usuario a /loginsi no ha iniciado sesión Si el usuario intentó acceder /logincuando ya había iniciado sesión, redirigirlo a la raíz/ así que ahora …

83 javascript  reactjs  react-router 

Estoy intentando configurar Google Analytics en mi sitio de reacción y me he encontrado con algunos paquetes, pero ninguno tiene el tipo de configuración que tengo en términos de ejemplos. Esperaba que alguien pudiera arrojar algo de luz sobre esto. El paquete que estoy viendo es react-ga . Mi método …

82 google-analytics  reactjs  react-router 

Estoy usando el componente Link del enrutador reactjs y no puedo hacer que funcione onClickevent. Este es el código: <Link to={this.props.myroute} onClick='hello()'>Here</Link> ¿Es esta la forma de hacerlo o de otra forma?

82 reactjs  react-router  react-redux 

Tengo problemas para cambiar la vista al reaccionar con el enrutamiento. Solo quiero mostrar una lista de usuarios, y al hacer clic en cada usuario, debo navegar a una página de detalles. Aquí está el enrutador: import React from "react"; import ReactDOM from "react-dom"; import { BrowserRouter } from 'react-router-dom'; …

82 reactjs  react-router 

Mirando este ejemplo de React Router Dom v4 https://reacttraining.com/react-router/web/example/auth-workflow , veo que el componente PrivateRoute destruye un apoyo de descanso como este const PrivateRoute = ({ component: Component, ...rest }) => ( <Route {...rest} render={props => ( fakeAuth.isAuthenticated ? ( <Component {...props}/> ) : ( <Redirect to={{ pathname: '/login', state: …

82 reactjs  react-router 

¿Alguien sabe cómo restringir el acceso a rutas particulares en react-router? Quiero comprobar si el usuario está conectado antes de permitir el acceso a una ruta en particular. Pensé que sería simple, pero los documentos no tienen claro cómo hacerlo. ¿Es esto algo que debería configurar donde defino mis <Route>componentes, …

81 javascript  reactjs  react-router 

Estoy usando el nuevo gancho useHistory de React Router, que salió hace unas semanas. Mi versión del router React es 5.1.2. My React está en la versión 16.10.1. Puedes encontrar mi código en la parte inferior. Sin embargo, cuando importo el nuevo useHistory desde react-router, me sale este error: Uncaught …

18 reactjs  react-router  react-hooks  react-router-dom  react-context 

Estoy usando el gancho UseHistory en react router v5.1.2 con typecript? Cuando ejecuto la prueba unitaria, tengo un problema. TypeError: No se puede leer la propiedad 'historial' de indefinido. import { mount } from 'enzyme'; import React from 'react'; import {Action} from 'history'; import * as router from 'react-router'; import …

18 reactjs  typescript  react-router  jestjs  enzyme 

Soy nuevo en Next.js y me pregunto cómo redirigir desde la página de inicio ( / ) a / hello-nextjs, por ejemplo. Una vez que el usuario carga una página y luego determina si path === / redirect to / hello-nextjs En react-router hacemos algo como: <Switch> <Route path="/hello-nextjs" exact …

15 html  reactjs  routing  react-router  next.js 

Estoy tratando de cargar una vista de detalles basada en una ruta react-router-dom que debería tomar el parámetro de URL (id) y usarlo para completar el componente. Mi ruta se ve /task/:idy mi componente se carga bien, hasta que trato de tomar el: id de la URL de esta manera: …

14 reactjs  react-router 

Estoy creando una aplicación React de una sola página, y he notado que la restauración de desplazamiento no parece funcionar como se esperaba en Chrome (y tal vez en otros navegadores). En el repositorio github react-router-dom, tienen una página que dice que los navegadores están comenzando a manejar de forma …

11 javascript  reactjs  google-chrome  react-router 

Estoy usando el enrutador de reacción con carga lenta de componentes y uso Webpack como un paquete , cuando accedo a la página de inicio / puedo ver en la pestaña de red que bundle.jsestá cargado y también cuando hago clic en un elemento específico en la barra lateral del …

8 javascript  reactjs  webpack  react-router  lazy-loading