Bellow code doesn't have any validation, when you send request http://example.com/post/this-is-my-first-blog it's exist but whenever you send http://example.com/post/wjhdsgdgdfgdfgfdgdfgd this request it also taken as valid request but don't sending to 404 page.
{
path: '/post/:slug',
name: 'PostDetails',
component: postdetails
},
{
path: '/404',
name: 'Notfound',
component: notfound
},
{
path: '*',
redirect: '/404'
}
- http://example.com/post/this-is-my-first-blog -> post exists
- http://example.com/post/wjhdsgdgdfgdfgfdgdfgd -> post donesn't exists
In this situation how you will validate your blog URL and non-exists URL
{
path: '/post/:slug',
name: 'PostDetails',
component: postdetails,
beforeEnter: (to, from, next) => {
function isValid (param) {
// check if param is valid
}
if (!isValid(to.params.slug)) {
next({ name: 'Notfound' });
}
next();
}
}
This is the solution to validate your url.Learn More Navigation Guards