安装

npm install vue-router --save

使用

需要在进行页面切换的地方添加** **进行页面的切换。

1.页面路由跳转

//页面中使用下面语句代替a标签实现跳转，在写完标签后还需要在router中写下以下语句
 <router-link to="/foo">Go to Foo</router-link>
const router = new VueRouter({
 { path: '/foo', component: Foo }//路由，component后面是文件地址，有几种方式
})
//component:方式
1. import user  from "../user.vue";
comonent : user
将组件用require引进来
2. component: resolve => require(['../template/list.vue'], resolve)//
用import将页面引入
3.   component: () => import('@/views/redirect/index')

2.编程式路由跳转

使用js进行路由跳转

router.push(location, onComplete?, onAbort?)
this.$router.push

动态路由

动态注册路由（动态在new router中注册路由）

动态向router数组中添加路由。

 let comment = [{path: '../../view/index/index.vue'}];
this.$router.options.routes[1].push({
 path: '/' + __menu.name,
name: __menu.name,
 name: __menu.name,
 component: resolve => require([comment[0].path], resolve)
 })
 this.$router.addRoutes(vm.$router.options.routes);//调用addRoutes添加路由

• 总结
  通过this.$router.options.router[1]可以找到自己定义的router，然后按照规则进行添加就可以，最后不要忘记使用**addRoutes()**将相关的路由进行添加，这样才可以正确的天机路由，尤其是不要将方法名写错。
  ###路由嵌套
  使用children进行路由的嵌套，相当于父子路由的嵌套。

const router = new VueRouter({
        routes: [
            {
                name: 'login',
                path: '/login',
                component: login
            },
            {
                name: 'main',
                path: '/main',
                redirect: '/icustomer',
                component: main,
                children: [
                    {
                        path: '/icustomer',
                        name: 'customer',
                        component: resolve => require(['../view/index/icustomer.vue'], resolve)
                    }
          ]} 
       ]
})

路由重定向

就是将路由指向别的路由，例如跳转index页面但是你想跳转其他页就可以使用重定向，将路由订到别的位置。

  {
                name: 'main',
                path: '/main',
                redirect: '/index',
                component: main
}//将main页面定向到index所指的页面，需要在下面声明index页面的路由，不然报错。

总结

对于其他要查看官方文档vue-router,一上只是我在使用过程中的一些想法有不对的地方希望可以指正，我们共同进步。