vue.js - 我可以用空组件创建 Vue 路由吗?

标签 vue.js vue-router

假设我有这些路线:

/admin/login
/admin
/admin/dashboard

/admin 的目的是根据用户的身份验证状态将用户重定向到 /admin/login/admin/dashboard .所以它没有模板/组件。实现这一目标的正确方法是什么?

我应该只创建一个 Admin.vue 组件来重定向用户吗?或者还有其他方法吗?

最佳答案

听起来你想要一个导航守卫。参见 https://router.vuejs.org/guide/advanced/navigation-guards.html

例如

[{
  path: '/admin',
  beforeEnter (to, from, next) {
    if (userIsAuthenticated) {
      next({ name: 'admin-dashboard' }) // or next('/admin/dashboard')
    } else {
      next({ name: 'admin-login' })     // or next('/admin/login')
    }
  }
}, {
  path: '/admin/dashboard',
  name: 'admin-dashboard',
  component: ...
}, {
  path: '/admin/login',
  name: 'admin-login',
  component: ...
}]

所以不,对于从不呈现任何内容的路由,您不需要 Admin 组件。


您可能还需要一个全局导航守卫来保护需要身份验证的页面。

关于vue.js - 我可以用空组件创建 Vue 路由吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54796743/

相关文章:

unit-testing - 如何测试vue Js metaInfo

vue.js - Navigation Guards beforeEach 无限循环

html - 为什么放置到 <router-link> 的标签 <img> 默认获得 CSS 属性 "display:none !important"?如何避免这种情况?

javascript - 如何捕获 Vue.JS SPA 中抛出的所有错误

arrays - 在 PostgreSQL 中将图像文件保存为 bytea 并检索它们以在 HTML 模板上显示

node.js - 如何修复 vue 中的 'ERR_OSSL_EVP_UNSUPPORTED' 错误?

javascript - 使用 vue- <router-link> 更改路由

vuejs2 - VueJs 获取url查询

javascript - 滚动行为 VueJS 无法正常工作

apache - apache上的vue-router,子目录下的SPA,只能通过redirect访问页面