技術標籤：Vue-routervue

1、path 和 query

下面的程式碼router-link的to引數，是一個地址

<router-link to='home'>點選跳轉到home</router-link>

可以通過to引數傳入一個物件

<router-link :to="{path:'/home',query:{a:1,b:2,c:3}}">點選跳轉到home</router-link>

query接收的是一個物件，內部的是配置的引數

2、name和params

<router-link :to="{name:'sport', params:{a:2,b:3,c:4}}" >點選跳轉到sport</router-link>
 

如果使用了name和params組合，在index.js中就要進行相關的name配置

{
    path: '/sport',
    name: 'sport',
    component: Sport
}

點選跳轉後，瀏覽器上沒有相關引數，但是實際上，攜帶了相關的引數，我們可以監聽$route的相關引數

監聽$route的結果

name和path這兩種跳轉方式，其實就是模仿了get和post請求，兩者各有優點，一個是name方式由於是post形式的跳轉，所以重新整理之後引數會丟失，但是保密性好；path方式重新整理頁面不會丟失引數，但是保密性差