nuxt: Unable to create a dynamic route with required parameter by following the guide
Version
Reproduction link
n/a
Steps to reproduce
Create following file/directory structure:
/pages/test1/_param1.vue
/pages/test2/_param2/index.vue
What is expected ?
Routes to be generated as:
/test1/:param1?
/test2/:param2
What is actually happening?
Routes are generated as:
/test1/:param1?
/test2/:param2?
Additional comments?
The guide says:
As you can see the route named
users-idhas the path:id?which makes it optional, if you want to make it required, create anindex.vuefile in theusers/_iddirectory instead.
Following this advice (test2) results the parameter still being optional.
The test related to this functionality (https://github.com/nuxt/nuxt.js/blob/2fabea9402864828fe9aafe8b0d13bcc674a1b3b/packages/utils/test/route.test.js#L174-L184) seems to cover only cases where the parameter is defined in a filename, eg being the very last node.
I believe that any parameters specified as directories should be treated as required, so it would be possible to have full control over whether a route parameter is required or optional without resorting to any workarounds.
<div align="right">This bug report is available on Nuxt community (#c9312)</div>About this issue
- Original URL
- State: closed
- Created 5 years ago
- Reactions: 8
- Comments: 21 (5 by maintainers)
Links to this issue
- Update dependency nuxt to ^2.17.1 (!958) · Merge requests · GitLab.org / gitlab-svgs · GitLab
- Update dependency nuxt to ^2.17.1 (!958) · Merge requests · GitLab.org / gitlab-svgs · GitLab
- Update dependency nuxt to v3 (!963) · Merge requests · GitLab.org / gitlab-svgs · GitLab
- Update dependency nuxt to v3 (!963) · Merge requests · GitLab.org / gitlab-svgs · GitLab
Just came across this issue after tripping on documentation too… 😃 If I may, +1 on changing code to behave as current doc says rather than changing doc to explain the double-file structure required for required params. I think that simply having a route with required param and relying on Vue Router’s default behaviour (throwing 404 when no matching route is found) sounds much cleaner and intuitive.
Of course this kind of change would be potentially breaking so would require caution (maybe best suited for a major release?) - but that’s definitely more in line with behaviour I’d expect.
But why introduce the overhead of component B? I am quite sure that vue-router is capable of deciding that
/test3should not match the route/test3/:param3and in that case just display a 404.Is changing the param name for nested routes really the suggested procedure here for making them required?
IMO this is really hacky and not ideal. What if Nuxt could just assume that any param is required if it’s a directory and not a .vue file?
@melihplt probably it’s best to file a new issue for the
ERR_TOO_MANY_REDIRECTScase. That’s exactly how one should solve that case.Should be fixed with v2.14.1
This is very unfortunate of me to miss the underscore. I will look for the reason of this cause. Thank you @Ingramz for your notice ❤️
I wouldn’t mind, however I’ll need to first understand whether my request of changing the behavior is reasonable compared to the way rest of the file to route mapping works.
If it turns out that is not a feasible option, I guess we can fix the documentation instead based on the knowledge gained from understanding the behavior better.