javascript - VueJS "RangeError: Maximum call stack size exceeded" - Stack Overflow

admin管理员组

文章数量:1406052

Please help me to fix this

router.js

routes: [{
  path: "",
  ponent: () => import("@/layouts/full-page/FullPage.vue"),
  children: [{
    path: "/pages/login",
    name: "page-login",
    ponent: () => import("@/views/pages/Login.vue")
  }, {
    path: "/pages/signup",
    name: "page-signup",
    ponent: () => import("@/views/pages/Signup.vue")
  }, {
    path: "/pages/error-404",
    name: "page-error-404",
    ponent: () => import("@/views/pages/Error404.vue")
  }]
}, {
  path: "*",
  redirect: "/pages/error-404"
}]

and

router.beforeEach((to, from, next) => {
  if (to.path != "/pages/login") {
    if (auth.isAuthenticated()) {
      next();
    } else {
      if(to.path == "/pages/signup") {
        next("/pages/signup");
      }else{
        next("/pages/login");
      }
    }
  } else {
    next();
  }
});

When I open pages/login the error doesn't happen. But when I open pages/signup, it's always an error.

This is the error in the console:

"RangeError: Maximum call stack size exceeded"

Please help me to fix this

router.js

routes: [{
  path: "",
  ponent: () => import("@/layouts/full-page/FullPage.vue"),
  children: [{
    path: "/pages/login",
    name: "page-login",
    ponent: () => import("@/views/pages/Login.vue")
  }, {
    path: "/pages/signup",
    name: "page-signup",
    ponent: () => import("@/views/pages/Signup.vue")
  }, {
    path: "/pages/error-404",
    name: "page-error-404",
    ponent: () => import("@/views/pages/Error404.vue")
  }]
}, {
  path: "*",
  redirect: "/pages/error-404"
}]

and

router.beforeEach((to, from, next) => {
  if (to.path != "/pages/login") {
    if (auth.isAuthenticated()) {
      next();
    } else {
      if(to.path == "/pages/signup") {
        next("/pages/signup");
      }else{
        next("/pages/login");
      }
    }
  } else {
    next();
  }
});

When I open pages/login the error doesn't happen. But when I open pages/signup, it's always an error.

This is the error in the console:

"RangeError: Maximum call stack size exceeded"

• javascript
• vue.js
• vuejs2
• routes
• vue-router

Share Improve this question Follow edited Apr 16, 2020 at 12:24 Dan 63.2k1818 gold badges111111 silver badges119119 bronze badges asked Apr 16, 2020 at 10:48 resitdcresitdc 3311 silver badge44 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 5

This will cause an infinite loop:

if(to.path == "/pages/signup") {
        next("/pages/signup");

It's redirecting to the same route it's already going to, which causes the beforeEach to run again, and then triggers another redirect on the next iteration. Change that to:

if(to.path == "/pages/signup") {
        next();

本文标签： javascriptVueJS quotRangeError Maximum call stack size exceededquotStack Overflow