一、簡介

本文github地址，base分支
在我們使用Vue.js構建單頁面應用時，必不可少的要使用到路由，但Vue.js本地不自具備，這時候vue-router就誕生了。那什么是路由呢？其實它類似我們常使用的“路由器”功能，對地址進行分發(fā)。根據(jù)地址欄不同的內容來指定到不同的頁面。

一、安裝與使用

本文將使用vue-cli快速搭建一個基于vue.js項目。

1. 安裝

這里注意，我沒有默認安裝vue-router，各位小伙伴可以在install vue-router的時候選擇yes。

2. 注冊使用

1） 新建路由文件

在src目錄下新建router文件夾并新建router.js文件,說明，vue-router是一個插件，要使用時要Vue.use(),在routes數(shù)組中為一個一個具體的路由配置選項。

import Vue from 'vue'
import Router from 'vue-router'

Vue.use(Router)

export default new Router({
    routes: []
})

2） 在vue.js中使用路由

在main.js文件中

import Vue from 'vue'
import App from './App'
import router from './router/router.js'  //引入路由規(guī)則

Vue.config.productionTip = false

new Vue({
  el: '#app',
  router,//使用路由
  template: '<App/>',
  components: { App }
})