时间戳

首页 > 解决方案 > 打开 vue 路由链接时跳过登录屏幕

laravel - 打开 vue 路由链接时跳过登录屏幕

问题描述

我在我的应用程序中使用 laravel 和 vue js。当我使用 laravel auth 时，所有的 vue 路由在打开时都要求登录。我想创建一些无需用户登录即可访问的路由。换句话说，我想要一些访客用户也可以访问的路由。但目前所有路由都需要对用户进行身份验证。这些是我的路线

const routes = [
    { path: '/dashboard_admin', component:  require('./components/dashboard.vue').default},
    { path: '/ongoing_events_admin', component:  require('./components/events.vue').default } ,
    { path: '/courses_admin', component:  require('./components/courses.vue').default},
    { path: '/front_images_admin', component:  require('./components/front_images.vue').default},
    { path: '/news_admin', component:  require('./components/news.vue').default},


    { path: '/main', component:  require('./components/main_view/index_view_general.vue') ,
    name: 'index',
    props: true ,
    beforeEnter:DontrequireLogin
    },


    //general vue

  // { path: '/', component:  require('./components/main_view/index_view_general.vue').default},

  ]


  const router = new VueRouter({
    mode: 'history',
    routes // short for `routes: routes`
  })



const app = new Vue({
    el: '#app',
    router
});

这些是我的路线。我希望其中一些路由也可以由访客用户访问，但目前所有路由都需要用户登录。

标签： laravelvue.js

解决方案

所以你需要做这个元的，更多关于这个你可以阅读它的官方文档Route Meta

让我稍微解释一下 meta 的作用。

在元中，您定义了一个布尔对象，该对象指示，此路由用于经过身份验证的用户或访客用户。让我们看看下面的例子。

我有经过身份验证的路由，仅适用于经过身份验证的用户。

{path: '/account-setting',component:accountSetting,meta:{auth:true}},

所以我在 meta 中传递 auth 对象并在 route.beforeach 中决定如何处理这条路线。

和正常路线一样

{path: '/about',component:about}

在此我不提供元数据，这意味着它适用于所有用户。

阅读文档以了解如何使用它。

推荐阅读