Vue中this.$router的使用

vue中this.$router.push有兩種使用方法：

1. 傳入參數且位址欄中帶上參數内容

   this.$router.push({path/name: ' 路由 ', query: {key: value}})
   （是path還是name由你自己定，如果是name那麼在定義路由的時候需要寫明
   類似這種：
   {
     path: '/home',
     name: 'Home',
     component: Home,
     meta:{
       titel:"首頁",
       content:"CISSP教育訓練"
     }
   }
   ）
              

   這裡的請求方法是

   query

   ，

   參數取值的方法是：

   this.$route.query.key

2. 傳入參數且位址欄中不帶參數内容

   this.$router.push({name: ' 路由的name ', params: {key: value}})
              

   參數的取值方法是：

   this.$route.params.key

   由于動态路由也是傳遞params的，是以在 this.$router.push() 方法中 path不能和params一起使用，否則params将無效，這時就需要用name來指定頁面，是以通常我們直接用name會比較好。

關于this.$router.push、replace、go的差別

1. this.$router.push

   ：跳轉到指定url路徑，并在history棧中添加一個記錄，點選後退會傳回到上一個頁面。

2. this.$router.replace

   ：跳轉到指定url路徑，但是history棧中不會有記錄，點選傳回會跳轉到上上個頁面。

3. his.$router.go(n)

   ：向前或者向後跳轉n個頁面，n可為正整數或負整數。

   如果n為0的話，将重新整理目前頁面。