Questions tagged [react-router-v4]

React Router - A complete routing library for React inspired by Ember's routing system

Introduction

React Router is a powerful routing library built on top of React that helps you add new screens and flows to your application incredibly quickly, all while keeping the URL in sync with what's being displayed on the page.


Docs


Related tags

1983 questions
423
votes
23 answers

How to push to History in React Router v4?

In the current version of React Router (v3) I can accept a server response and use browserHistory.push to go to the appropriate response page. However, this isn't available in v4, and I'm not sure what the appropriate way to handle this is. In this…
Chris
  • 5,310
  • 5
  • 21
  • 28
360
votes
17 answers

Programmatically navigate using react router V4

I have just replaced react-router from v3 to v4. But I am not sure how to programmatically navigate in the member function of a Component. i.e in handleClick() function I want to navigate to /path/some/where after processing some data. I used to do…
Colin Wang
  • 5,988
  • 5
  • 21
  • 39
354
votes
6 answers

React Router with optional path parameter

I want to declare a path with an optional path parameter, hence when I add it the page to do something extra (e.g. fill some data): http://localhost/app/path/to/page <= render the page http://localhost/app/path/to/page/pathParam <= render the…
tbo
  • 7,760
  • 6
  • 35
  • 46
324
votes
11 answers

Nested routes with react router v4 / v5

I am currently struggling with nesting routes using react router v4. The closest example was the route config in the React-Router v4 Documentation. I want to split my app in 2 different parts. A frontend and an admin area. I was thinking about…
datoml
  • 4,594
  • 3
  • 17
  • 27
267
votes
8 answers

React Router v4 - How to get current route?

I'd like to display a title in that is somehow passed in from the current route. In React Router v4, how would be able to get the current route passed into it's title prop?
Raphael Rafatpanah
  • 15,663
  • 19
  • 73
  • 136
171
votes
13 answers

How to listen to route changes in react router v4?

I have a couple of buttons that acts as routes. Everytime the route is changed, I want to make sure the button that is active changes. Is there a way to listen to route changes in react router v4?
Kasper
  • 8,678
  • 10
  • 34
  • 53
143
votes
16 answers

How to implement authenticated routes in React Router 4?

I was trying to implement authenticated routes but found that React Router 4 now prevents this from working:
Jiew Meng
  • 74,635
  • 166
  • 442
  • 756
106
votes
4 answers

React Router v4 vs benefits

Besides the ability to set an "activeClassName" and "activeStyle" on NavLink, is there any reason to use NavLink over Link when creating links to other routes on non-navigational elements (ie. not main nav in header or footer) on your site that…
yam55
  • 1,151
  • 2
  • 8
  • 11
104
votes
13 answers

react-router (v4) how to go back?

Trying to figure out how can I go back to the previous page. I am using [react-router-v4][1] This is the code I have configured in my first landing page:
Akshay Lokur
  • 4,868
  • 11
  • 36
  • 51
103
votes
8 answers

Detect Route Change with react-router

I have to implement some business logic depending on browsing history. What I want to do is something like this: reactRouter.onUrlChange(url => { this.history.push(url); }); Is there any way to receive a callback from react-router when the URL…
94
votes
10 answers

How to get query parameters in react-router v4

I'm using react-router-dom 4.0.0-beta.6 in my project. I have a code like following: And I want to get query params in HomePage component. I've found location.search param, which looks like this:…
andrfas
  • 1,192
  • 1
  • 9
  • 14
74
votes
1 answer

React-Router - Link vs Redirect vs History

There seems to be some confusion with what to use over the other: history.push('/some/path') I have been using React/Router for a little while now, and different posts/answers say different things…
Phillip
  • 2,486
  • 3
  • 21
  • 39
71
votes
6 answers

React history.push() is updating url but not navigating to it in browser

I've read many things about react-router v4 and the npm history library to this point, but none seems to be helping me. My code is functioning as expected up to the point when it should navigate and do a simple redirect when the url is changed…
John
  • 885
  • 1
  • 6
  • 10
68
votes
2 answers

onEnter not called in React-Router

Ok, I'm fed up trying. The onEnter method doesn't work. Any idea why is that? // Authentication "before" filter function requireAuth(nextState, replace){ console.log("called"); // => Is not triggered at all if (!isLoggedIn()) { replace({ …
html_programmer
  • 14,612
  • 12
  • 59
  • 125
65
votes
5 answers

Nested Routes in React Router v4

I'm trying to set up some nested routes to add a common layout. Check the code out:
Sean Gillespie
  • 751
  • 1
  • 5
  • 6
1
2 3
99 100