在vue-router的子路由中指定部分路径

Question

我试图更好地理解vue-router上嵌套路由的工作方式。我这样设置路线

const routes = [
    {
        path: '/',
        component: Home
    },
    {
        path: '/users',
        component: User,
        children: [
            {
                path: '/users/:id',
                component: UserDetails
            },
            {
                path: '/users/:id/edit',
                component: UserEdit
            }
        ]
    }
];

阅读文档，我了解我可以像下面的子路由那样编写路由：

const routes = [
    {
        path: '/',
        component: Home
    },
    {
        path: '/users',
        component: User,
        children: [
            {
                path: '/:id',
                component: UserDetails
            },
            {
                path: '/:id/edit',
                component: UserEdit
            }
        ]
    }
];

但似乎对我不起作用。 有人可以向我解释如何解决吗？

谢谢