vue路由

今日学习
路由进阶
1) 嵌套路由
routes:[{
path:’/order’,
component:Order,
children:[{
path:‘all’,
component:Order_All
},{
path:‘completed’,
component:Order_Completed
},{
path:‘un_completed’,
component:Order_Un_Completed
}]
},{
path:’/goods’,
component:Goods
}]
2) 导航守卫
1. 组件内守卫 【声明在组件实例对象中】
beforeRouteEnter
beforeRouteUpdate
beforeRouteLeave
当进入该组件的时候，如果进入之前路由发生改变，该守卫就会被激发
/article/1 - Article
/article/2 - Article 由于路由发生变换，所有会激发该守卫
2. 全局守卫【绑定在router对象上】
router.beforeEach()
router.afterEach()
3. 组件独享守卫【定义在route对象上】
routes:[{
path:’’,
component:,
beforeEnter:()=>{

        }
      }]
      3) vue/cli中融合vuerouter机制
    使用vue/cli创建项目，集成vue以及vueRouter
    1. 使用vue/cli直接创建基于vue + vueRouter项目
      1) 使用vue/cli初始化基于vue + vueRouter的项目
        > vue create app04
          手动安装特性
          babel
          Router
        创建完成后，项目中依赖了vue vueRotuer

      2) 安装jquery【ajax】，在public/index.html通过script引入jquery即可

      3) 安装elementui【通过插件形式进行安装】
        > vue add element
        全部导入
        可以修改element样式文件