Dynamically load component if parameter is set

How to make routes for that scenario.

I wanted to:

map /users against Users component

map /users/:id against SingleUser component

map /users/create against CreateUser component

Off the top of my head:

routes: [
    { path: '/users', component: Users,
      children: [
        {
          path: 'create',
          component: CreateUser
        },
        {
          path: ':id',
          component: SingleUser
        },
      ]
    }
  ]

I believe it should match create on /users/create, but /users/:id if create isn’t matched.

Your problem is likely due to you using / in your children paths.

Note that nested paths that start with / will be treated as a root path. This allows you to leverage the component nesting without having to use a nested URL.

https://router.vuejs.org/guide/essentials/nested-routes.html

Well, I wanted to render Users against /users and SigleUser against /users/:id:
I don’t want to render SingleUser in Users component.
If I follow your solution it means I have to make a router view in Users component, but I don’t want to do this.

Then don’t make them children of the route. Define them as root level routes.