我想在我的登录页面中添加一个被遗忘的密码页面，但是在我更新代码之后，我不能跳到它

Question

我想在登录页面中添加一个被遗忘的密码页面，

但是我不能在更新代码之后跳到它上。

网站错误信息：

路由navigation

• Uncaught (承诺) undefined

• Maximum呼叫堆栈大小超过

的

• vue-路由器未登录错误

旧码

router.beforeEach((to, from, next) => {
  const isLogin = localStorage.getItem("token") == "ImLogin";
  var role = localStorage.getItem('roles');
  if (isLogin) {
    if (to.matched.every(item => item.meta.indexOf(role) > -1)) {
      next();
    } else {
      next('/tips');
    }
  } else {
    if (to.path !== "/login") next("/login");
    else next();
  }
});

新码

<v-btn
  class="font-weight-bold"
  style="color:#FF7D52"
  href
  @click.prevent="forgetPassword"
  text
  >forgetPassword
</v-btn>

forgetPassword() {
      this.$router.push("/forgetPassword");
    },

router.beforeEach((to, from, next) => {
  const isLogin = localStorage.getItem("token") == "ImLogin";
  var role = localStorage.getItem('roles');
  if (isLogin) {
    if (to.matched.every(item => item.meta.indexOf(role) > -1)) {
      next();
    } else {
      next('/tips');
    }
  } else {
    if (to.path === "/forgetPassword") {
      next("/forgetPassword");
    } else {
      if (to.path !== "/login") next("/login");
      else next();
    }
  }
});

Answer 1

if (to.path === "/forgetPassword") {
      next("/forgetPassword");
}

正如Matt用户建议的那样，这将创建一个无限循环，因为导航到"/forgetpassword“将再次触发路由器beforeEach挂钩。

简单地说，next();应该解决这个问题。