vue路由元信息

• meta：路由元信息

• 路由记录

  定义：routes配置的每一个路由对象都称为路由记录
  特点：路由记录是可以嵌套的，如果一个路由匹配成功，它可以匹配多个路由

• 路由记录的遍历

$route.matched:一个路由匹配到所有的路由记录

• 例：

import Vue from "vue";
import VueRouter from "vue-router";
Vue.use(VueRouter);
export default new VueRouter({
    mode:"history",
    routes:[
        {
            path:"/",
            redirect:"/login"
        },
        {
            path:"/home",
            component:resolve=>require(["../components/home.vue"],resolve),
            children:[
                  {
                      path:"/about",
                      component:resolve=>require(["../components/about.vue"],resolve),
                      meta:{requireLogin:true}
                  } 
            ]
        },
        {
            path:"/login",
            component:resolve=>require(["../components/login.vue"],resolve)
        }
    ]
})

VueRouter.beforeEach((to,from,next)=>{
        if(to.matched.some(record=>record.meta.requireLogin)){
      //to.matched表示匹配路由的所有路由记录的数组
      //record.meta.requireLogin表示路由记录中的meta中的requireLogin属性
           let token=localStorage.getItem("token"); 
           if(token==null||token==""){
                  next("/login")
            }else{
                  next()
            }
        }else{
              next();
        }
 })