vue-router

前端路由优势：单页面应用中，无需多次请求服务器资源

使用vue-cli 构建的项目中，在src -> main.js 中配置路由

import "VueRouter" from "vue-router"

引用vue-router 模块

Vue.use(VueRouter)

注册使用vue-router

let router = new VueRouter({
    mode:"history",
    routes:[
        {
            path:'/',
            redirect:'/xxx'
        },
        {
            path:'/foo',
            component:Foo
        },
        {
            path:'/bar',
            name:bar,
            component:Bar
        }
        
        ]
})

创建一个router实例，ps:使用组件前先要import引入

new Vue({
    el:"myApp",
    router
})

在vue实例中使用

router-link : 路径跳转                      router-view:渲染组件

动态路由参数：路由映射中path 可以携带参数，vue实例会暴露$route属性让组件访问关于路由的一些属性，this.$route.params、this.$route.query、this.$route.path

编程式导航：router.push(path)、router.replace(path)