next/router is a library provided by Next.js. Use this tag if you need help with the useRouter hook, the withRouter HOC, or with the extracted information from the router object.
Questions tagged [next-router]
293 questions
0
votes
0 answers
Next js: Can we use React router with Next js for server side rendering?
Context:
I have a react app with multiple pages along with react router, some pages use references of react router to read route params. Now I am trying to create a new app with next js, so that I could server side render all my pages.
For this, I…
Dinesh Kumar
- 107
- 1
- 10
0
votes
0 answers
Next.js equivalent to Navigation Guards (Vue)?
Basically I'm trying to intercept each route before it's served.
Say user navigates to /login, I want to redirect to /en/login.
If /en/login doesn't exist, then 404.
The current approach is to have a folder structure like this:
src
|-- pages
|--…
AX2
- 135
- 12
0
votes
1 answer
How to disable Navbar component in dynamic routes in next.js.?
I Know one way of doing this is by using the next router, but only in case when the route is static like /dashboard'.But how to do it when the URL is dynamic like '/story/[slug]'.
Layout.js
const Layout=({children })=>{
if(router.pathname !=…
TASKMASTER
- 831
- 1
- 8
- 15
0
votes
0 answers
Why getting 404 error in routing in next.js?
I have a Next.js application.Initially the homepage is loaded to the user and after a timer of 10 the user has to be redirected to a feedback page:
const router=useRouter();
if(timer==0)
{
router.push('/feedback');
clearTimeout(time);
…
Vatsal A Mehta
- 392
- 2
- 15
0
votes
1 answer
Prevent useEffect infinite loop when updating NextJs query string
I have a tag input that produces an array of tags. Using NextJs's useRouter, I want to add those tags as query string params as they are added. I also need to preserve the current query string params, since other filters, searches, and pagination…
DasBeasto
- 2,082
- 5
- 25
- 65
0
votes
0 answers
Next JS: Router.replace not working without rebuilding the package-lock.json file
We recently locked to node version 14.19.1 to maintain a stable version across environments. But after this, The below functionality is not working without deleting the lock file and rebuilding it.
Router.replace is not working without dropping the…
Yeshwanth Kumar
- 81
- 1
- 1
- 8
0
votes
1 answer
Nextjs shallow routing for tabs?
Have a tabs component which work perfectly with the router.query state
useEffect(() => {
let found = false;
if (currentTab !== 'leads') {
router.push(`${id}?tab=${currentTab}`, undefined, {
shallow:…
abhishekbutola
- 59
- 1
- 9
0
votes
1 answer
Using Next router to link to a dynamically created page
Fairly new to NextJs - I am trying to link between a category index page and a dynamically created page, which is using getServerSideProps
I have created a product template page with the following path -
/products/[...product]
I am trying to link to…
Eddie
- 31
- 5
0
votes
1 answer
NextJS TypeError: Cannot read property 'pathname' of undefined
I am migrating an entire app from React to Next.js v12. I solved the majority of the problems but I'm having some trouble with routing.
I replaced useHistory with useRouter as we are not using react-router package anymore and I'm getting this final…
giosan
- 291
- 1
- 4
- 15
0
votes
1 answer
Is there any option to change route and pass props to another component in Next.js?
I am at this path: http://localhost:3034/dashboard/one.
Now I want to pass a large object in another component
tirth1620
- 154
- 1
- 8
0
votes
1 answer
NextJS Router doesn't reload data until page refocus
Currently working with NextJS, but struggling to make an indexing page of sorts. With the router, I'm trying to get the page number by doing this:
let router = useRouter()
let page = isNaN(router.query.page) ? 1 : parseInt(router.query.page);
So…
Tony Ingall
- 41
- 5
0
votes
1 answer
NextJS error in catch all routes when I try to find the route length
I get this error when I try to catch all the routes
TypeError: Cannot read properties of undefined (reading 'length')
This error happened while generating the page. Any console logs will be displayed in the terminal window.
Here's my code:
import…
Arunprasath
- 57
- 1
- 7
0
votes
2 answers
browser back button does not re-render component after router.push
Scenario :
I am on Page A which have a X component that has state sunny = false initially. after I did some operation in component; state is updated to sunny = true. now I route.push(Page B). when I navigate back to Page A using browser back button…
Sukh
- 31
- 1
- 7
0
votes
0 answers
page fails to load when refreshed when query data is passed with router.push in nextjs
router.push({
pathname: "/singleview",
query: { data: JSON.stringify(props) },
});
Page failed to load (This page isn’t working HTTP ERROR 431) when refreshed.
Neeleshwar Kumar
- 335
- 3
- 13
0
votes
1 answer
404 page not found on nextJs app refreshing on netlify
This is the link to my GitHub project, see the directory structure: https://github.com/SutirthaDey/crowdcoin
app link: https://crowdcoins.netlify.app/
I have used react,nextJs, and next routes for dynamic routing. The problem I'm facing is after…
Sutirtha Dey
- 17
- 2