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
3
votes
1 answer
Next.js app in subfolder with basePath, how to make home page available outside of basePath?
My Next.js application is running in the '/portal/' folder and basePath is set as follows:
module.exports = {
basePath: '/portal'
}
Now I need index page of that application to be also available in site root (without basePath). So that both '/'…
Julia
- 1,301
- 1
- 14
- 29
3
votes
0 answers
Why is my Next.js router reloading the page, even with shallow routing
I am creating a search page. You can have a search query, e.g. "Nike" and then you can click different categories or conditions.
My file structure in pages is just:
search > index.tsx
When a user changes a category or condition, the search works…
squish
- 846
- 12
- 24
3
votes
4 answers
Can't type in react input field
I have a simple form with an input field that I can't type on. I first thought the problem was with the onChange or the value props that were setting the input to readonly, but the fact is that I cant type with the browser suggestions and the state…
Roger Esteve
- 31
- 1
- 3
3
votes
2 answers
Next.js Link "as" decorator stopped working for dynamic routes?
I have a dynamic route:
test/[id].js
When user clicks on a link pointing to /test/1 Next.js ends up rendering the proper page as intended.
The funny business starts when I want to have /test/1 url masked with anything else.
Wordpressor
- 7,173
- 23
- 69
- 108
3
votes
0 answers
How to manually configure routing instead of File based routing in NextJS
We know in Next.js, We express application structure in the file system. When a file is added to the pages directory it's automatically available as a route. For example:
pages/about.js → /about
pages/blog.js → /blog
pages/index.js → /
But I want to…
Wahid Hoque
- 41
- 2
3
votes
1 answer
How can you create a Private route in next.js?
I want to wrap my whole application so that it is not accessible unless the user is logged in. I managed to redirect the user to the login page if the user is not logged in, however, i still see a flash of the private route before the redirection…
poca
- 3,630
- 3
- 13
- 19
3
votes
1 answer
Redirect user after login with react redux?
I'm using react redux with Next.js and I want to redirect the user to a certain page if he matches the requirement. I added it in my useEffect and it works, but every time when I go back to the home page it redirects again to the same page. It works…
Anjula Samarasinghe
- 227
- 5
- 10
3
votes
1 answer
Next.js - How to show post name in the url instead of the id and make it unique?
I searched for this but I could only find examples in Laravel and PHP, and I need to know how to do this with Next.js.
All I know is that I can do dynamic routes in Next.js the usual way like this ...
/pages/post/[postId] which will translate to…
Ruby
- 2,207
- 12
- 42
- 71
2
votes
1 answer
NextJS: Maximum update depth exceeded error
I am trying to use router function to send user to login page but I get an error stating:
Unhandled Runtime Error
Error: Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or…
Shehbaz
- 21
- 2
2
votes
1 answer
I set the next version to 13 and now the storybook build won't go through
After updating next.js to 13, the storybook build fails.
Below is a version of the storybook.
I have no idea how to solve this problem.
If anyone can help me figure it out, please let me know.
error
ERR! => Failed to build the preview
ERR! Module…
aaa
- 69
- 5
2
votes
0 answers
NextJS pages/index.ts overriden by pages/[catchAll].tsx route only in Production
I'm trying to achieve dynamic routing like this:
Example route: pages/[...slug].tsx
example.com/first-page
example.com/second-page
example.com/any-page
The problem is that example.com/ is caught by pages/[...slug].tsx.
And at the same time I need…
Zackdev
- 41
- 4
2
votes
1 answer
Nextjs: Module not found: Can't resolve 'next-router'
I am trying to import use Router from next-router, but I am obtaining this error: Module not found: Can't resolve 'next-router'
I have installed last version of next 13.0.6
package.json:
{
"name": "frontend",
"version": "1.0.0",
"private":…
hrd
- 23
- 3
2
votes
0 answers
Progressive Web App - Inconvenient back button functionality when downloaded as mobile app
I made a PWA using Nextjs and next-pwa and I used the Nextjs router. On the browser, the back button pops the url on the history stack. This is the intended behavior for browsers.
However, when I download and use the PWA on mobile, the mobile back…
John Roice M. Aldeza
- 43
- 5
2
votes
1 answer
Nextjs: Sidebar routing
I am trying to figure out how to use next.js routes to populate a sidebar component with route instructions so that when a sidebar option is clicked, the main div is populted with the relevant component.
I can find tutorials showing the CSS for side…
Mel
- 2,481
- 26
- 113
- 273
2
votes
1 answer
Next/router cannot handle notFound in getServerSideProps
I have a link: appBaseUrl/edit/:userId
I want it to be transited by next/router like following:
router.push(`appBaseUrl/edit/${userId}`)
and in the getServerSideProps function is like following:
export const getServerSideProps: GetServerSideProps =…
QSBK
- 44
- 4