What problem is this solving

AddRoute() with ParentName does not add routes as Children of the parent

I came across this issue when I was trying to access children of a Route but kept getting undefined.

I am trying to get the router object with all the routes consisting or parents and child routes but Unflattened.

router.getRoutes() -> Flattened Array

I need to know which route is child and which is not. This functionality will improve the way we resolve routes and catch errors for 3rd party integration.

1 of the challenges I am facing is to be able to get the list of all the children of a parent route.

Code Structure:

const router = createRouter({
    history: createWebHistory(),
    routes: [{
            path: "/home",
            name: "home",
            component: HomePageVue
    }]
})

const sampleChildRoute = [{
    path: "/sample",
    name: "sample",
    component: SamplePageVue
}]

// Adding routes to parent name = home
sampleChildRoute.forEach(route => router.addRoute( 'home', route ))

router.options.routes.forEach(route => console.log(route.children))

// This code works fine.

When I try to run a for loop to console.log(children of Home) Its always undefined.

I know a very rough gist of what is wrong here but I would highly appreciate an explanation for this behaviour.

🥲🥲🥲🥲!!!

My Request

The above code add the route just fine but has implication on resolution of routes with scrutiny based architecture.

It would be great to see if we could add a way to differentiate weather 🌦️ a route is child or is parenting other routes.

Discussion History Reference

Proposed solution

I would like router.addRoute( ParentName, childRoute ) to be accessible by parentRoute.children

Describe alternatives you've considered

An alternative is adding the updated parent route again.

parentRoute.children.push(clientRoutes)
router.addRoute( parentRoute )

vuejs / router