????????介绍
????????????????路由：控制组件之间的跳转，不会实现请求、不用页面刷新，直接跳转-切换组件
????????安装
? ? ? ? ? ? ? ? npm install vue-router
????????配置
????????????????在src文件新建文件夹router用来存放路由器的配置文件
在routes.js中引入所需要展示的页面
?配置一级路由路径
图中Test02为引入的页面，名称与上方import的值对应
?path为定义的路由路径
App.vue是项目的主组件，页面入口文件?，所有页面都在App.vue下进行切换，app.vue负责构建定义及页面组件归集。
配置好路由之后在App.vue中 <div id ="app"></div>中放置一个<router-view></router-view> 将路由器匹配的组件渲染在这里。
二级路由配置原理基本一致
?即在所在的一级路由的配置下添加children:[填写当前二级路由的路径的配置信息]
?二级路由的路径需填所在一级路由的路径后接二级路径
同样在所在的一级路径所属页面下的div里面也放置一个<router-view></router-view> 将路由器匹配的组件渲染在这里。
最后再通过
export default routers(与上定义routers对应)? 输出routers
切换到main.js下
引入? import?VueRouter?from?'vue-router'??
再引入刚刚所配置好的路由
?引进的vue-router必须要通过?Vue.use()使用路由
构建VueRouter对象，把引进的路由配置文件放进去
Vue.config.productionTip = false
上面这行代码的意思 是阻止显示生产模式的消息。
如果没有这行代码，或者设置为true，控制台就会多出这么一段代码。
You are running Vue in development mode.
Make sure to turn on production mode when deploying for production.
大概意思就是：
你运行的Vu是开发模式。为生产部署时，请确保启用生产模式。
new Vue({ render: h => h(App), }).$mount('#app')
这里创建的vue实例没有el属性，而是在实例后面添加了一个$mount(’#app’)方法。
$mount(’#app’) ：手动挂载到id为app的dom中的意思
?再将构建的VueRouter对象放进来即可。