Vue.js 2 Web Development Projects

Guest routes

There is another case we don't manage yet--we don't want an already connected user to access the login route!

1. That's why we will mark it as a guest route:

      { path: '/login', name: 'login', component: Login,        meta: { guest: true } },

2. Inside the beforeEach navigation guard, we will check if the route is guest-only and if the user is already connected, then redirect to the home page:

      router.beforeEach((to, from, next) => {        // ...        if (to.meta.guest && state.user) {          next({ name: 'home' })          return        }        next()      })

If you are logged in, you can try going to the login URL--you should be immediately redirected to the home page! You can only access this page if you are not logged in.