Vue Router Child, Trailing slash

Question

Is is it normal behavior for Vue to add a trailing slash to the default child subroute?

For example:

URL

Result:
/#/user/test/

Link

<router-link :to="{ name: 'user', params: { username: 'test' } }">Test User Overview</router-link>

Routes

routes: [
     {
        path: '/user/:username',
        component: User,
        children: [
            {
                path: '',
                name: 'user',
                component: UserOverview
            },
            {
                path: 'stats',
                name: 'user.stats',
                component: UserStats
            }
        ]
    }
]

I would expect the user link to have the path specified by its parent, meaning without a trailing slash. Like this: /#/user/test. If its normal behavior, can I somehow prevent it?

This solution solved my problem stackoverflow.com/a/58132290/4801486 — Cristiana Pereira

Unknown Unknown · Accepted Answer · 2017-11-17T12:31:37

Yes, it is. And do not try to prevent this behaviour, it is preferred and recommended.

Read more in this article - it is older, but not outdated: https://webmasters.googleblog.com/2010/04/to-slash-or-not-to-slash.html?m=1

Vue Router Child, Trailing slash

1 Answers