转到 Vuejs 2 中的特定路线

Posted 2023-02-23

【中文标题】转到 Vuejs 2 中的特定路线

【英文标题】：Go to a specific route in Vuejs 2

【发布时间】：2017-05-01 04:24:41

【问题描述】：

我是 VueJS 的新手，我正在使用 VueJS 2 Webpack 模板。 如果登录成功，我试图从登录组件重定向到主组件，我已经尝试了很多东西，但仍然出现错误。 这是我的路线：

const router = new VueRouter(
  mode: 'history',
  routes: [
    'name': 'home',
    path: '/',
    component: require('./components/Home.vue'),
    beforeEnter: (to, from, next) => 
      if (!localStorage.getItem('user')) 
        next('/login')
      
    
  , 
    'name': 'profile',
    path: '/profile',
    component: require('./components/Profile.vue'),
    beforeEnter: (to, from, next) => 
      if (!localStorage.getItem('user')) 
        next('/login')
      
    
  , 
    'name': 'login',
    path: '/login',
    component: require('./components/Login.vue')
  , 
    'name': 'new',
    path: '/new',
    component: require('./components/New.vue'),
    beforeEnter: (to, from, next) => 
      if (!localStorage.getItem('user')) 
        next('/login')
      
    
  , 
    'name': 'signup',
    path: '/signup',
    component: require('./components/Signup.vue')
  , 
    'name': 'logout',
    path: '/logout',
    beforeEnter: (to, from, next) => 
      localStorage.removeItem('user')
      next('/login')
    
  , 
    'name': 'article',
    path: '/article/:id',
    component: require('./components/Article.vue'),
    beforeEnter: (to, from, next) => 
      if (!localStorage.getItem('user')) 
        next('/login')
      
    
  ]
)

这就是我试图重定向到主组件的内容：

this.$router.replace(this.$router.go('/'))

我得到了这个错误：

Uncaught (in promise) TypeError: Cannot read property 'name' of undefined(…)

【参考方案1】：

this.$router.replace() 需要一个位置。

this.$router.go('/') 遍历浏览器历史记录，因此它实际上不应返回任何内容。它本质上类似于window.history.go(Number)。

如果你想替换你所在的页面，你可能想要this.$router.replace('/')。

还有。我会查看文档的这一部分。您可以将大量重复代码放在beforeEach 中。

https://router.vuejs.org/en/advanced/meta.html

【讨论】：

没问题！