Почему router не обрабатывает вложенный компонент маршрута?

Question

[Евгений]

Если я указываю роуты в такой структуре (все в корне), то всё работает.

[
    {
        path: '/hello',
        name: 'hello',
        component: Hello,
    }, {
        path: '/hello/test1',
        name: 'hello-test1',
        component: HelloTest1
    }, {
        path: '/hello/test2',
        name: 'hello-test2',
        component: HelloTest2   
    }
]

Как только я переношу их во вложенный маршрут, tо все вложенные маршруты обрабатывается только родительским компонентом Hello

[
    {
        path: '/hello',
        name: 'hello',
        component: Hello,
        children: [
            {
                path: 'test1',
                name: 'hello-test1',
                component: HelloTest1
            }, {
                path: 'test2',
                name: 'hello-test2',
                component: HelloTest2
            }
        ]
    }
]

https://codesandbox.io/s/m6y4n
Понял свою ошибку, при сложенном маршруте, рендеринг идет родительским компонентом.

Answer 1

[Антон Антон]

В компоненте Hello есть <router-view></router-view>?

Comments

[Евгений]

Пока взял пример на codesandbox, понял что у родительского нужно тоже прописывать . Но тогда он добавляет контент из новых компонентов к родительском. А не заменяет его.

Только не могу если я прописываю , в основном app компоненте почему он не монтируется туда, или нужно через именованное представление ?

Answer 2

[0xD34F]

Что значит "не обрабатывает"? Не рендерит? А есть где? Вложенный router-view не забыли добавить?

Comments

[Евгений]

Теперь понял. Но не могу понять почему router-view, по мимо основного компонента APP, куда монтируется приложение надо ещё и добавлять в родительский "Hello". Корневые элементы без вложения же рендерит.

[0xD34F]

Евгений, допустим, не надо. Тогда вопрос - где отображать компоненты вложенных маршрутов? На месте компонента родительского маршрута? А если они оба должны рендериться?

[Евгений]

0xD34F, Спасибо теперь понял