Vue-router的学习

官方文档：https://router.vuejs.org/zh/

安装

方法1、npm install vue-router
方法2、 在项目中的package.json文件dependencies对象中添加
eg：
然后，在cmd输入npm install 进行安装

（最新版本可在vue-router源码‘https://github.com/vuejs/vue-router’–package.json中查看）

引用

1、在项目文件main.js中import vue-router（把vue-router赋值给VueRouter这个变量）

2、通过Vue.use()方法安装vue-router插件

（使用独立编译文件时不需要这样做，路由模块会自动安装）

基本用法

1、html（App.vue）
使用 router-link 组件来导航
通过传入to属性指定链接
<router-link>默认会被渲染成一个<a>标签

通过路由外链<router-view></router-view>展示链接的内容

2、js (main.js)
a).定义（路由）组件

b).定义路由
每个路由应该映射一个组件，其中"component"可以是通过Vue.extend()创建的组件构造器，或者说是一个组件配置对象。

重定向也是通过routes配置来完成，
下面例子是从根下重定向到‘/articles’

c).创建router实例，然后传routes配置（也可传别的配置参数，eg：mode）

d).创建和挂载根实例
要通过router配置参数注入路由，从而让整个引用都有路由功能

演示