在 Vue 實例內部，你可以通過 $router 訪問路由實例。因此你可以調用 this.$router.push

想要導航到不同的 URL，則使用 router.push 方法。這個方法會向 history 棧添加(jia)一(yi)個新的(de)記錄，所以(yi)，當用戶點擊(ji)瀏(liu)覽器后退按鈕時，則回(hui)到之前的(de) URL。

這里(li)我(wo)們主(zhu)要采用對(dui)象跳(tiao)轉形式。

要跳轉頁面的path屬性值：router.push({ path: 'my-exchange' })，對應router數組對象中的path屬性值：

要跳轉頁面的name屬性值：router.push({ name: 'my-exchange-index' })，對應router數組對象中的name屬性值：

給頁面傳參則在push函數傳入的實參對象中的第二個屬性傳入 query 或 params對象即可，對象中寫具體要傳的參數（注：如果query 或 params對象中的屬性傳入的有引用類型的，則需要JSON.stringify(引用類型)轉化一下）。

在對應的頁面接收也只需要：this.$route.query 或 this.$route.params:

官方解釋：

其中我個人建議對象的第一個屬性用name來控制要跳轉的頁面，因為如果是path的話，params屬性將會被忽(hu)略（也就是(shi)說(shuo)傳參要(yao)采用拼(pin)接字符串的方式，超不利(li)于代碼越多，看的還不舒服）。

同時對于第二個屬性，我個人建議采用query來進行路由傳參，因為 params 對象傳參，只要頁面一刷新你傳入的參數就沒了，query則保(bao)存在url地址中(zhong)，你怎么(me)刷新它都還在。

小總結一下：

使用params傳參在瀏覽器的url地址欄中是不可見得，query則類似于get傳參，是可見的。

params傳參會丟失數據，query不會。

不過雖然params傳參會丟失數據，但是它不會污染 url 路徑，會顯得 url 路徑特別的(de)整潔(jie)干凈。

所以偶爾也會使用params傳參。

當然啦，也有很多方法可以處理params傳參會丟失數據問題，比如通過Cookies來存儲數據即可。

在頁面進入就執行的生命周期函數中看一下 this.$route.params 中有沒有東西，如果有，則把它存到 Cookies 里面，如(ru)果頁面刷新了(le)，數(shu)據(ju)沒了(le)，則直接從(cong)Cookies 里面拿即可。