react-router-v4

问题 I'm newbie. And I'm newbie at React . I'm trying react-router . I saw this example: https://reacttraining.com/react-router/web/example/basic. I reproduced it on Codesandbox.io here: https://codesandbox.io/s/7jxq0j6qp0 I don't understand why the Menu is re-rendering itself when I change URL using menu's links. If you open console you can see it. Why? I think it should not re-render itself. Just the route section. Where am I wrong? 回答1: You can write your component as PureComponent. Since there

问题 I checked [here][1] and [here][2] but it dint help me. I am using react-router version 4 and when I tried to run console also not showing anything nor my page. please help me out here I put one console that is also not printing anything means my headerContainer it self it not being rendered here is my index.js import ReactDOM from 'react-dom'; import React from 'react'; import { Provider } from 'react-redux'; import configureStore from './stores/configureStores'; import {BrowserRouter,Route

问题 My Routing is working perfectly when URL is changed through Link component of React-router. However, if I try to change URL manually in browser, it hits 404 Error. Below is the routes.js file import React from "react"; import {Route, Switch, NotFoundRoute} from 'react-router-dom'; import App from "./components/app.jsx"; import HomePage from "./components/homePage.jsx"; import AboutPage from "./components/about/aboutPage.jsx"; import AuthorPage from "./components/authors/authorPage.jsx";

问题 I know how to pass props in the react router like string type for example. But I have a problem when I try to pass props of function. On my children component, this props is "undefined" . Exemple of my Link : <Link to={'/Content/' + this.props.index + '/' + this.props.decreaseIndexProject}>Page n°1</Link> The index props is a number, so I can get it on my children component, but not the decreaseIndexProject props. I use PropType : NavBar.propTypes = { indexProject: PropTypes.number,

问题 How can I redirect the user to a NoMatch component when I have nested routes in React Router V4? Here is my code: import React from 'react'; import ReactDOM from 'react-dom'; import injectTapEventPlugin from 'react-tap-event-plugin'; injectTapEventPlugin(); import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'; import Website from './website/Website'; const Register = ({ match}) => { return ( <div> <Route exact path={match.url} render={() => {return <h1>Register</h1>} } />

问题 I have an issue with react router 4. And I'm not sure if its solvable: This is my application layout: Which basically works. But the problem is that whenever I hit /items/:id/ via the link on the left side it also matches /items . Which causes the link list in the sidebar to rerender. The solution would be to nest the routes. But this is not possible due to the interface/DOM. The left sidebar needs be independent of the item detail. And I need to split those up like: <div> <div className=

问题 I am new to React and Redux, I am actually creating a code of myself but I got stuck with a router kind of thing inside stateless component. So, Actually I need to route to a component by using this.props.history.push('/somepath'). This is not happening inside a stateless component. My Stateless component is import React from "react"; // eslint-disable-line no-unused-vars import "bootstrap/dist/css/bootstrap.min.css"; import "./header.css"; const Header = () => ({ handleAuthor() { this.props

问题 I'm trying to port my project from using v3 of react-router to v4 of what is now called react-router-dom . Now the problems arise when I have a MenuBar component, which is completely separate from the routing logic (as you'd expect), because it will show the exact same links whatever the current path may be. Now that worked all nicely with v3, but now when I'm using NavLink , which has the same activeClassName property, the active route does not update on the NavBar, only on refresh. That

问题 I'm trying to port my project from using v3 of react-router to v4 of what is now called react-router-dom . Now the problems arise when I have a MenuBar component, which is completely separate from the routing logic (as you'd expect), because it will show the exact same links whatever the current path may be. Now that worked all nicely with v3, but now when I'm using NavLink , which has the same activeClassName property, the active route does not update on the NavBar, only on refresh. That

问题 Trying to set up a react app with React-Router v4. I require navigation with a dynamic route param, and the ability to target areas of my app template with a component that takes the dynamic route param. According to the v4 docs, I need to define my routes like this: const routes = [ { exact: true, path: '/vpcs', navLevel2: () => <VpcList></VpcList>, mainContent: () => <h1>Hello VPCs</h1> }, { exact: true, path: '/vpcs/:vpcName', navLevel2: () => <VpcList></VpcList>, mainContent: () => <Vpc><