Не работает вложенный роут в Nuxt

Всем привет! Уже довольно долго пытаюсь понять проблему. В общем есть проект на nuxt, в нём стоит пакет @nuxtjs/router который берёт файл из ./router вот он:

const home_url = "dashboard_analytics";
const router = new Router({
    mode: 'history',
    routes: [
        {
            path: '',
            component: () => import('@/pages/index').then(m => m.default || m),
            children: [
                {path: '', redirect: {name: home_url}},
                {
                    path: 'dashboard',
                    component: () => import('@/pages/dashboard/layout').then(m => m.default || m),
                    children: [
                        {path: '', redirect: {name: "dashboard_analytics"}},
                        {
                            path: 'analytics',
                            name: 'dashboard_analytics',
                            component: () => import('@/pages/dashboard/analytics/index').then(m => m.default || m)
                        },
                        
                    ]
                },

                {
                    path: 'payments',
                    component: () => import('@/pages/payments/layout').then(m => m.default || m),
                    children: [
                        {path: '', name: 'payments_index', redirect: {name: "payments_list"}},
                        {
                            path: 'list',
                            name: 'payments_list',
                            component: () => import('@/pages/payments').then(m => m.default || m),
                        },
                        {
                            path: 'paynet',
                            name: 'payments_category',
                            component: () => import('@/pages/payments/categories').then(m => m.default || m),
                        },
                        {
                            path: 'paynet/:category_id/services',
                            name: 'payments_services',
                            components: () => import('@/pages/payments/services').then(m => m.default || m)
                        },
                    ]
                },
            ]
        },
        {
            path: '/auth',
            component: () => import('@/pages/auth/layout').then(m => m.default || m),
            children: [
                {path: '', redirect: {name: "auth_login"}},
                {
                    path: 'login',
                    name: 'auth_login',
                    component: () => import('@/pages/auth/login').then(m => m.default || m)
                },
                {
                    path: 'logout',
                    name: 'auth_logout',
                    component: () => import('@/pages/auth/logout').then(m => m.default || m)
                },
            ]
        },
        {
            path: '/error',
            name: 'error',
            component: () => import('@/pages/error/index').then(m => m.default || m)
        },
        {path: '*', redirect: {name: 'error'}}
    ],
    scrollBehavior(to, from, savedPosition) {
        return new Promise((resolve, reject) => {
            setTimeout(() => {
                if (savedPosition) {
                    resolve(savedPosition)
                } else {
                    resolve({x: 0, y: 0})
                }
            }, 500)
        })
    }
})

router.beforeEach((to, from, next) => {
    next()
})

return router

Задача стоит такая, нужно сделать динамический роут вида : "payments/:categroy/:category_id/services/:services_id". Но когда я создаю такой роут, он просто не отрисовывается, и код в mounted() тоже не срабатывает, в деббаггере я вижу просто закомментированную строку вида: "<!-- -->". Даже переходя на роут "paynet/:category_id/services", где "paynet" - должен быть динамичным, ничего не отрисовывается...

Заранее большое спасибо!

P.S. Это не полный файл роутов с проекта, он слишком большой, и по большей части не интересен. Там уже есть динамичные роуты, но без вложенности.


Ответы (0 шт):