Meta configuration item of route

1. meta It is called routing meta information , It is the information carried in the route , You can customize meta To realize some routing functions

2. Use scenarios ： For example, set the title of the page corresponding to each route 、 And determine whether a page needs permission verification

   routes: [
       {
         
           //  Name this route guanyv
           name: 'guanyv',
           path: '/about',
           component: () => import('../views/About.vue')
           //  Customize title Properties and isAuth attribute , Used in route navigation guard , Set the title and permission verification for the page 
           meta: {
          title: ' About ', isAuth: true}
       },	
       ...
   ]
   

   //  Use the global pre routing guard to authenticate the page 
   router.beforeEach((to, form, next) => {
         
       //  By judging whether authentication is required 
       if (to.meta.isAuth) {
         
           if (localStroage.getItem('token') === 'xxxx') {
         
               //  eligible , Release to the next route 
               next()
           } else {
         
               console.log(' Check failed ')
           }
       }
   })
   
   //  Use the global pre routing guard to modify the page title 
   router.afterEach((to, form, next) => {
         
       //  Judge whether there is title attribute 
       if (form.meta.title) {
         
           document.title = to.meta.title //  Modify page title 
       }
   })