Why doesn't router handle nested route component?

Question

Vue.js

If I specify routes in such a structure (everything in the root), then everything works.

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

As soon as I wrap them in a nested route, then all nested routes are processed only by the parent component 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
Understood my mistake, with a folded route, rendering is done by the parent component.

Answer 1

Does the Hello component have a ? <router-view></router-view>