Vue router beforeEach causing InternalError: too much recursion

Question

我有以下 vue 路由器文件，我希望路由器在用户未登录的情况下将用户重定向到注册页面。当用户登录时，它工作正常，但当他没有登录时，我收到以下错误：

InternalError: too much recursion

控制台也输出not logged in，说明错误是if语句体中的next方法引起的

路由器index.js

import Vue from 'vue'
import VueRouter from 'vue-router'
import store from '../store'

Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    redirect: 'Dashboard',
  },
  {
    path: '/dashboard',
    name: 'dashboard',
    props: true,
    component: () => import('@/views/dashboard/Dashboard.vue'),
  },
  {
    path: '/Dashboard',
    name: 'Dashboard',
    props: true,
    component: () => import('@/views/dashboard/Dashboard.vue'),
  },

  {
    path: '/ProjectPage/:id',
    name: 'ProjectPage',
    props: true,
    component: () => import('@/views/pages/ProjectPage/ProjectPage.vue')
  },
  {
    path: '/MyIssues',
    name: 'MyIssues',
    props: true,
    component: () => import('@/views/pages/MyIssuesPage/MyIssuesPage.vue')
  },
  {
    path: '/IssuePage/:id',
    name: 'IssuePage',
    props: true,
    component: () => import('@/views/pages/IssuePage/IssuePage.vue')
  },
  {
    path: '/CreateProject',
    name: 'CreateProject',
    component: () => import('@/views/pages/CreateProjectPage/CreateProject.vue')
  },

  {
    path: '/pages/account-settings',
    name: 'pages-account-settings',
    component: () => import('@/views/pages/account-settings/AccountSettings.vue'),
  },
  {
    path: '/pages/login',
    name: 'pages-login',
    component: () => import('@/views/pages/Login.vue'),
    meta: {
      layout: 'blank',
      requireLogin: false,
    },
  },
  {
    path: '/pages/register',
    name: 'pages-register',
    component: () => import('@/views/pages/Register.vue'),
    meta: {
      layout: 'blank',
      requireLogin: false,
    },
  },
  {
    path: '/error-404',
    name: 'error-404',
    component: () => import('@/views/Error.vue'),
    meta: {
      layout: 'blank',
    },
  },
  {
    path: '*',
    redirect: 'error-404',
  },
]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes,
})


router.beforeEach((to, from, next) => {
  if (to.matched.some(record => !record.meta.requireLogin) && !store.state.isAuthenticated) {
    console.log('not logged in')
    next({ name: 'pages-register', query: { to: to.path } });
  } else {
    console.log('logged in')
    next()
  }
});

export default router

Answer 1

pages-register也有人看守

  {
    path: '/pages/register',
    name: 'pages-register',
    component: () => import('@/views/pages/Register.vue'),
    meta: {
      layout: 'blank',
      requireLogin: false,
    },
  },

您必须删除它。否则，你会遇到递归路由

Vue router beforeEach causing InternalError: too much recursion

Vue router beforeEach causing InternalError: too much recursion

vue.js

vue-router

vuex

vuejs2