vue-router中的抽象路由

Question

vue-router中有没有类似angular中的抽象路由？

{
    path:'/'
    children:[
        {
            path:'demo'
            children:[
                {
                    path:'foo'
                    component:foo
                },
                {
                    path:'bar'
                    component:bar
                }
            ]
        }
    ]
}

比如path:'demo'的路由是一个abstract抽象路由，demo这个路由并不对应任何的路由出口，只是一个抽象的层级关系。

{
    path:'/'
    children:[
        {
            {
                path:'demo/foo'
                component:foo
            },
            {
                path:'demo/bar'
                component:bar
            }
        }
    ]
}

可以写成上面的形式来使demo不对应任何路由出口，但是又想使用真正的层级关系。
如何实现？

Answer 1

{
    path:'/'
    component:main
    children:[
        {
            path:'demo'
            component:{template:"<div><router-view/></div>"},
            redirect:"/404"
            children:[
                {
                    path:'foo'
                    component:foo
                },
                {
                    path:'bar'
                    component:bar
                }
            ]
        }
    ]
}

暂时使用上面的形式模拟angular-ui-router中的abstract抽象路由