定義：vue-router是Vue.js官方的路由插件笆呆，它和vue.js是深度集成的析孽，適合用于構(gòu)建單頁(yè)面應(yīng)用穆役。
1.vue-router是基于路由和組件的
路由用于設(shè)定訪(fǎng)問(wèn)路徑, 將路徑和組件映射起來(lái).
在vue-router的單頁(yè)面應(yīng)用中, 頁(yè)面的路徑的改變就是組件的切換.
2.使用vue-router的方法
步驟一: 安裝vue-router
npm install vue-router --save 或在vue ui圖形化可視界面安裝
步驟二: 在模塊化工程中使用它(因?yàn)槭且粋€(gè)插件, 所以可以通過(guò)Vue.use()來(lái)安裝路由功能)
第一步：導(dǎo)入路由對(duì)象胡桃，并且調(diào)用 Vue.use(VueRouter)
第二步：創(chuàng)建路由實(shí)例食绿，并且傳入路由映射配置
第三步：在Vue實(shí)例中掛載創(chuàng)建的路由實(shí)例
步驟三：使用vue-router的步驟:
第一步: 創(chuàng)建路由組件
第二步: 配置路由映射: 組件和路徑映射關(guān)系
第三步: 使用路由: 通過(guò)<router-link>和<router-view>
3.設(shè)置路由的默認(rèn)路徑
配置解析:
我們?cè)趓outes中又配置了一個(gè)映射.
path配置的是根路徑: /
redirect是重定向, 也就是我們將根路徑重定向到/home的路徑下, 這樣就可以得到我們想要的結(jié)果了.
4.使用HTML5的history模式和修改linkActiveClass(選中的模塊類(lèi)名）
5.動(dòng)態(tài)路由
在某些情況下侈咕，一個(gè)頁(yè)面的path路徑可能是不確定的，比如我們進(jìn)入用戶(hù)界面時(shí)器紧，希望是如下的路徑：
/user/aaaa或/user/bbbb
除了有前面的/user之外耀销，后面還跟上了用戶(hù)的ID
這種path和Component的匹配關(guān)系，我們稱(chēng)之為動(dòng)態(tài)路由(也是路由傳遞數(shù)據(jù)的一種方式)铲汪。
? ? ? ? ? ? ? ? $route表示獲取活躍狀態(tài)的路由熊尉，通過(guò)params.abc獲取之前設(shè)置的參數(shù)
