Preguntas etiquetadas con react-router

A veces he visto a personas envolver sus componentes withRoutercuando los exportan: import { withRouter } from 'react-router-dom'; class Foo extends React.Component { // ... } export default withRouter(Foo); ¿Para qué es esto y cuándo debo usarlo?

109 reactjs  react-router 

He estado pensando y estoy confundido con el enrutamiento entre Cliente y Servidor. Supongamos que uso ReactJS para la representación del lado del servidor antes de enviar la solicitud al navegador web, y uso react-router como un enrutamiento del lado del cliente para cambiar entre páginas sin actualizar como SPA. …

108 javascript  reactjs  routes  react-router  url-routing 

Estoy haciendo la transición de mi aplicación de reacción de webpack-dev-server a nginx. Cuando voy a la URL raíz "localhost: 8080 / login", simplemente obtengo un 404 y en mi registro de nginx veo que está tratando de obtener: my-nginx-container | 2017/05/12 21:07:01 [error] 6#6: *11 open() "/wwwroot/login" failed (2: …

107 nginx  react-router 

¿Alguna forma de evitar que se /#/muestre en la barra de direcciones del navegador cuando se usa react-router? Eso es con ReactJS. es decir, al hacer clic en los enlaces para ir a una nueva ruta se muestra localhost:3000/#/o localhost:3000/#/about. Dependiendo de la ruta.

103 reactjs  react-router 

No entiendo cuál es el propósito de usar IndexRoute e IndexLink . Parece que, en cualquier caso, el código a continuación seleccionaría primero el componente Inicio a menos que se activara la ruta Acerca de. <Route path="/" component={App}> <IndexRoute component={Home}/> <Route path="about" component={About}/> </Route> vs <Route path="/" component={App}> <Route path="home" …

102 javascript  reactjs  react-router  url-routing 

Soy nuevo en React Router y descubro que hay muchas formas de redirigir una página: Utilizando browserHistory.push("/path") import { browserHistory } from 'react-router'; //do something... browserHistory.push("/path"); Utilizando this.context.router.push("/path") class Foo extends React.Component { constructor(props, context) { super(props, context); //do something... } redirect() { this.context.router.push("/path") } } Foo.contextTypes = { router: …

102 reactjs  redux  react-router 

Tengo un pequeño problema al migrar de React-Router v3 a v4. en v3 pude hacer esto en cualquier lugar: import { browserHistory } from 'react-router'; browserHistory.push('/some/path'); ¿Cómo logro esto en v4. Sé que me vendría bien, el hocico withRouter , el contexto de reacción o los accesorios del enrutador de …

101 reactjs  react-router 

Estoy trabajando en una aplicación de reacción usando react-router. Tengo una página de proyecto que tiene una URL de la siguiente manera: myapplication.com/project/unique-project-id Cuando se carga el componente del proyecto, activo una solicitud de datos para ese proyecto desde el evento componentDidMount. Ahora me encuentro con un problema en el …

100 reactjs  react-router 

Tengo lo siguiente: <Route name="app" path="/" handler={App}> <Route name="dashboards" path="dashboards" handler={Dashboard}> <Route name="exploreDashboard" path="exploreDashboard" handler={ExploreDashboard} /> <Route name="searchDashboard" path="searchDashboard" handler={SearchDashboard} /> <DefaultRoute handler={DashboardExplain} /> </Route> <DefaultRoute handler={SearchDashboard} /> </Route> Cuando se usa DefaultRoute, SearchDashboard se procesa incorrectamente ya que cualquier * Dashboard debe procesarse dentro de Dashboard. Me gustaría que …

98 javascript  routes  reactjs  url-redirection  react-router 

Soy nuevo en ReactJs. Este es mi codigo: var React = require('react'); var ReactDOM = require('react-dom'); var {Route, Router, IndexRoute, hashHistory} = require('react-router'); var Main = require('Main'); ReactDOM.render( <Router history={hashHistory}> <Route path="/" component={Main}></Route> </Router>, document.getElementById('app')); y compilarlo con webpack. También agregué el componente principal a mis alias. La consola arroja …

97 reactjs  react-router 

Además de la capacidad de establecer un "activeClassName" y "activeStyle" en NavLink, ¿hay alguna razón para usar NavLink sobre Link al crear enlaces a otras rutas en elementos que no son de navegación (es decir, no navegación principal en el encabezado o pie de página) en su sitio? que no …

94 reactjs  react-router  react-router-v4 

Estoy probando React-Router (v4) y tengo problemas para iniciar el Nav para tener uno de los Linkmejores active. Si hago clic en cualquiera de las Linketiquetas, las cosas activas comienzan a funcionar. Sin embargo, me gustaría que Home Linkesté activo tan pronto como se inicie la aplicación, ya que ese …

86 javascript  reactjs  ecmascript-6  react-router 

Tengo algunos problemas de estilo al usar react-router y react-bootstrap. a continuación se muestra un fragmento del código import { Route, RouteHandler, Link } from 'react-router'; import AuthService from '../services/AuthService' import { Button, Nav, Navbar, NavDropdown, MenuItem, NavItem } from 'react-bootstrap'; <Nav pullRight> <NavItem eventKey={1}> <Link to="home">Home</Link> </NavItem> <NavItem eventKey={2}> …

85 react-router  react-bootstrap 

He tenido algunos problemas con el enrutador react (estoy usando la versión ^ 4.0.0). este es mi index.js import React from 'react'; import ReactDOM from 'react-dom'; import App from './App'; import './index.css'; import { Router, Route, Link, browserHistory } from 'react-router'; ReactDOM.render( <Router history={browserHistory} > <Route path="/" component={App} /> </Router>, …

85 javascript  json  reactjs  react-router 

¿Hay alguna forma de hacer que React Router abra un enlace en una nueva pestaña? Intenté esto y no funcionó. <Link to="chart" target="_blank" query={{test: this.props.test}} >Test</Link> Es posible suavizarlo agregando algo como onClick="foo"el enlace que tengo arriba, pero habría un error de consola. Gracias.

85 reactjs  react-router