router.beforeEach((to, from, next)

Main methods:

  • to: which route to go into
  • from: Which route from leave
  • next: the control parameters of the routing, commonly used next (true) and next (false)

First, determine whether to enter the login page? And then determine whether the landing?
Has landed on you to jump into the page, not login to enter login page

To be more clear, I will name the page of simpler, ps:

    • Login.vue is the landing page
    • Index.vue is the global page (including a common navigation components)
      A.vue ordinary page (as I am here Home)
      B.vue ordinary page

 

 

 

//router.js 
Import from Vue 'VUE' 
Import from Router 'VUE-Router' 

Vue.use (Router); 

const Children = [ 
  { 
    path: 'A', 
    name: 'A', 
    Component: () => Import ( './views/A.vue'), 
    Meta: { 
      title: 'A page', 
      the keepAlive: no-cache to false // 
    } 
  }, 
  { 
    path: 'B', 
    name: 'B', 
    Component: () = > Import ( './ views / B.vue'), 
    Meta: { 
      title: 'page B', 
      the keepAlive: there cache to true // 
    } 
  }, 
  { 
    path: '404', 
    name: '404',
    component: () => import('./components/404.vue')
  }
];
const router =  new Router({
  MODE: 'History', 
  Base: process.env.BASE_URL, 
  routes: [ 
    {path: '/', the redirect: '/ A'}, 
    {path: '*', the redirect: '/ 404'}, 
    { 
      path: '/ Login', 
      name: 'Login', 
      Component: () => Import ( './ Components / Login.vue') 
    }, 
    { 
      path: '/', 
      Component: () => Import ( './ Components /Index.vue '), // index on the left of the figure is a common menu 
      children // here station page, the page displayed in the right container in 
    } 
  ] 
}); 
router.beforeEach ((to, from, Next) = > { 
  const = isLogin sessionStorage.getItem ( 'isLogin'); // get local store login information  
  if (to.name == 'login') {// determines whether to enter the login page
    if (isLogin == "true ") {// determine whether the landing
      next ({name: 'a' }); // logged in, jump Home (a page) 
    } {the else 
      the Next (); // not logged in, continue to enter the login page 
    } 
  } the else {// If the incoming non-login page 
    if (isLogin == "true") {// determine whether the same landing 
      next (); // already logged in, the normal access 
    } {the else 
      the Next ({name: 'the Login'}); // not logged in, jump to login page 
    } 
  } 
}); 
Export default Router;
Published 316 original articles · won praise 33 · views 210 000 +

Guess you like

Origin blog.csdn.net/yz18931904/article/details/104060041