Vue.js实战：使用vue-router实现页面跳转

前言

在开发Vue.js项目时会发现一个页面通常由多个组件构成，在切换页面时由于不能直接使用传统的href地址进行跳转因此开发团队创造了vue-router

在查阅官方文档以及网络相关资源后进行了总结记录

官方文档： https://router.vuejs.org/zh-cn/essentials/getting-started.html

这次的实例主要实现下图的效果：

一、配置 Router

在使用 vue-cli 生成的基础模板中，并未配置 vue-router 必须通过 npm 包括此处以导入代码块

    cnpm i vue-router -D

安装完成后，在 src 文件夹下，创建一个 routers.js 文件，和 main.js 平级

然后在 router.js 中引入所需的组件，创建 rou