vue-router映射配置和页面呈现（简洁）

首先在src目录下建一个router文件夹，然后再建一个index.js

然后进入index.js,

• 先从vue-router（已经下载好了）引入 VueRouter插件，该插件可以起到映射path和component的作用
• 然后再从vue引入Vue
• 建立一个路由对象router，这里面插入路由组件routes（名字固定，不能改）（图里那个是const routes 打错了 ）
• 然后导出该对象

在 main.js导入router对象，并且在Vue对象里定义

在src目录下的components里添加两个vue文件

然后在里面写要写的内容（其实这两个vue就是控制两个不同的界面）

• 然后在index.js里导入home.vue about.vue
• 配置path component的映射关系

最后在App.vue里将之前的两个路由配置导入，如图中

然后运行

完美！大概的过程就是这样啦，这只是个简单的案例，主要是要理解原理。