最近在學(xué)習(xí)vue的單頁(yè)面應(yīng)用開發(fā)，需要vue全家桶带欢，其中用到了VueRouter磺浙，在路由的設(shè)置和跳轉(zhuǎn)中遇到了兩個(gè)對(duì)象route 徒坡，有些傻傻分不清，后來(lái)自己結(jié)合網(wǎng)上的博客和自己本地的Vue devtools結(jié)構(gòu)了解了他們的區(qū)別
1.router是VueRouter的一個(gè)對(duì)象喇完，通過(guò)Vue.use(VueRouter)和VueRouter構(gòu)造函數(shù)得到一個(gè)router的實(shí)例對(duì)象锦溪，這個(gè)對(duì)象中是一個(gè)全局的對(duì)象，他包含了所有的路由包含了許多關(guān)鍵的對(duì)象和屬性刻诊。
舉例：history對(duì)象
$router.push({path:'home'});本質(zhì)是向history棧中添加一個(gè)路由，在我們看來(lái)是 切換路由复局，但本質(zhì)是在添加一個(gè)history記錄
方法：
$router.replace({path:'home'});//替換路由粟判，沒(méi)有歷史記錄
2.route是一個(gè)跳轉(zhuǎn)的路由對(duì)象，每一個(gè)路由都會(huì)有一個(gè)route對(duì)象档礁，是一個(gè)局部的對(duì)象，可以獲取對(duì)應(yīng)的name,path,params,query等
我們可以從vue devtools中看到每個(gè)路由對(duì)象的不同
這兩個(gè)不同的結(jié)構(gòu)可以看出兩者的區(qū)別，他們的一些屬性是不同的羹幸。
- $route.path
字符串，等于當(dāng)前路由對(duì)象的路徑供炼，會(huì)被解析為絕對(duì)路徑，如"/home/news"袋哼。 - $route.params
對(duì)象，包含路由中的動(dòng)態(tài)片段和全匹配片段的鍵值對(duì) -
route.query.favorite == 'yes'` 睛琳。
- $route.router
路由規(guī)則所屬的路由器（以及其所屬的組件）。 - $route.matched
數(shù)組师骗，包含當(dāng)前匹配的路徑中所包含的所有片段所對(duì)應(yīng)的配置參數(shù)對(duì)象。 - $route.name
當(dāng)前路徑的名字寒屯，如果沒(méi)有使用具名路徑黍少，則名字為空。
$route.path, $route.params, $route.name, $route.query這幾個(gè)屬性很容易理解要出，看示例就能知道它們代表的含義
