[Vuejs]-Can vue routes have a default value for a parameter?

by

1👍

✅

You can achieve something like this using router navigation guard:

routes = [
  {
    name: 'FormStep',
    path: ':uuid*/form/:step'
    beforeEnter(route) {
      return { 
        path: route.path, 
        params: {
          ...route.params,
          step: route.params.step ?? defaultStep
        }
      }
    }
  }
]
👤Romalex

0👍

Short anwser is: no you can’t.

If the user goes to :uuid/form, you have to redirect him with the default step value. But if the /uuid/form page points to the same page component, the redirection won’t cause a re-render, so it’s almost transparent from the user point of view.

If you control the navigation to this page, just set a default value yourself in the code if it’s not present:

const step = userStep || 'defaultStep'
this.$router.push(`/${myUuid}/form/${step}`)
👤Kapcash

Leave a comment