Vue Router 是 Vue.js 官⽅的路由管理器。它和 Vue.js 的核⼼深度集成，让构建单⻚⾯应⽤变得易如反 掌
安装：vue add router（Use history 选项选N）核⼼步骤：
步骤⼀：使⽤vue-router插件，router.js在router的index.js里
import VueRouter from 'vue-router' //问：为什么用use方法？它做了什么 //答：VueRouter是插件，使用插件必须使用use方法 //《接下》在内部做一些事情，因为我们可以使用this.$router可以访问到Router实例，此时$router哪来的，实际上就与main.js挂载的router有关 //由此我们可以猜测 这个use 就是把main.js中的router把它设置到prototype上去 //由此答插件做的第一个任务：Vue.prototype.$router //第二个任务：实现并注册两个全局组件 Vue.use(VueRouter)首先是猜测它做了什么 此时对外暴露export default router，并在main.js中使用
new Vue({ //由此再问，在这设置了router，他是怎么起作用的呢？ -- 由此就回到了第一问 //实际上就是index.js中的use方法，它里面的插件VueRouter实现一个特别的挂载 《去上》 router, store, render: h => h(App) }).$mount('#app') 步骤⼆：创建Router实例，router.js / router index.js export default new Router({…})步骤三：在根组件上添加该实例，main.js import router from './router' new Vue({ router, }).$mount("#app"); 步骤四：添加路由视图，App.vue //作用组件其一 <router-view></router-view> 导航 //作用组件其二 <router-link to="/">Home</router-link> <router-link to="/about">About</router-link>步骤结束 由此 引出在App.vue中
//路由出口 //问：url变化为什么内容也跟着变 //猜测：url变化时，把用户配置路由表里的组件拿出来，渲染一下，router-view去渲染 <router-view/>响应式数据 你可以这么理解响应式数据，就是它变了以后 这个组件的render函数会重新执行
写一个属于自己的router，而不是npm i 的router 步骤：
复制router文件夹为krouter ，改main.js里为import router from './srouter，因为我们要写自己的插件，所以将krouter里的index.js里的插件改为import VueRouter from './kvue-router'，并在krouter文件夹里建kvue-router.js插件kvue-router.js //本次需要实现的插件 //vue里要求插件必须实现install方法 所以： //1.实现install方法 class KVueRouter {} // 静态的install方法 function(Vue) 形参Vue是Vue的构造函数，但他是怎么来的？Vue把自己传进来的 KVueRouter.install=function(Vue){} // 插件么 我们要暴露出一个KVueRouter 即原始的 VueRouter export default KVueRouter