Vue中的路由使用，最好直接使用官方提供的vue-router。

3.1 路由的安装类型

安装分为两种，可以在使用脚手架进行项目初始化的时候，直接选择安装路由。这样搭建完的项目中，会有一个router文件夹，下面包含一个index.js文件。这里面的配置会在后面详细说。

3.1.1 通过脚手架安装的路由

第一步，对于初始化时安装的路由，在router/index.js中会默认生成如下的基础配置。

import Vue from 'vue'
import Router from 'vue-router'
// 引入要路由的组件
import Home from '@/components/Home'
Vue.use(Router)

export default new Router({
  routes: [
// 配置路径
    {
      path: '/',
      name: 'Home',
      component: Home
    }
  ]
})

此时，要想使用路由，只需要把相应的组件引进来，然后配置路由变量routes。
第二步，在App.vue文件的template中添加路由出口。

<router-view/>

第三步，配置跳转的使用前，需要将路由设置为全局可见。那么明显，就需要在main.js中进行一定的设置。

import router from './router'
new Vue({
  el: '#app',
  router,
  components: { App },
  template: '<App/>'
})

配置跳转

<router-link to="/handler" tag="span">处理中心</router-link>

npm install vue-router --save-dev