About the failure of vueRouter next ('/')

problem description

wrote a demo of vue-router and wanted to implement:

  • enter the page and first redirect to / index and then there is a < router-link to= "/ login" > to login < / router-link > Click to jump to the / login page;
  • but I wrote in the global guard that when to.paht ="/ login" , I skip to the front page via next ("/") ;
  • normally, it will be skipped to the front page and should not go to the / login page;
  • but now you can enter, and when you use http://localhost:8080/-sharp/login, the second time you type a link in the address bar, you will automatically jump to / index but once and still enter / login ;

related codes

router.js routing 

{
    path: "/",
    redirect: "/index"
  },
  {
    path: "/index",
    name: "index",
    component: Index
  },
  {
    path: "/login",
    name: "login",
    component: Login
  },
  {
    path: "/404",
    name: "404",
    component: PageError
  },
  {
    path: "*",
    redirect: "/404"
  }

Global Guard in main.js 

router.beforeEach((to, form, next) => {
  console.log("-beforeEach-", to.path)
  if (to.path === "/login") {
    console.log("-login-")
    next("/")
  }
  next()
}

data output by console 

 -beforeEach- /index
 -beforeEach- /login
 -login-

in theory, the output of -login- should trigger next ("/") , and then enter the guard output -beforeEach- / and enter / index , but the guard is not actually triggered again.

the environmental background of the problems and what methods you have tried

  • try to change next ("/") to next ("/ a") then you can successfully enter the / 404 page;
  • but enter http://localhost:8080/-sharp/login via url to enter the / login page;
  • tries to find a rule, that is, when the path of the current page is the same as next ("/") , the jump will fail;
Vue-router vue.js javascript
Dec.28,2021 
router.beforeEach((to, form, next) => {
  console.log('-beforeEach-', to.path);
  if (to.path === '/login') {
    console.log('-login-');
    next('/');
  } else {
    next();
  }
});
Change

to this, if you encounter '/ login' , you will execute next

twice.

Previous: How does mysql design tables for daily data records?

Next: How to write the two-tier popover of the mui framework?

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1ea1cca-4795a.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1ea1cca-4795a.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?