Vue：vue-router編程式導航

聲明式導航通過標簽來實現頁面跳轉，編程式導航通過調用js的API來實現跳轉，在vue中最常見的編程式導航API是push函數和go函數，

聲明式導航：

 

通過命名路由的name屬性，可以實現路由的導航和跳轉

給路由規則加一個name屬性，這樣就變成一個命名路由了，這個命名路由可以幫助我們實現路由跳轉，需要再to前面加一個屬性綁定的冒號，

to前面加一個冒號，代表屬性綁定，name代表我們要跳轉的路由規則，params代表我們攜帶的路由參數，

作用：可以通過name路由實現頁面的跳轉，我們在使用router-link去跳轉頁面的時候，可以直接寫一個path路徑之外，還可以指定一個name,表示點擊當前鏈接，希望跳到這個name所指定的路由規則中，此外還可以使用params屬性給這一次跳轉傳遞參數。

 

其中push方法給它一個hash地址，就能跳轉到指定的組件頁面，go方法是為了實現前進和后退的，n是一個數值，如果傳1表示在歷史記錄中向前走一位，如果傳-1，在歷史記錄中后退一位，

 

我們已經通過編程式導航，跳轉到了注冊頁面，也希望通過按鈕后退到剛才的user頁面，我們可以在注冊頁面中再放一個button按鈕

通過push方法跳轉到指定的頁面，通過go方法可以前進和后退

編程式導航的push方法還有一些其他的用法，比如說

1、可以給push方法提供一個對象，對象中包含path屬性，也指向一個hash地址，

2、可以給push方法提供一個對象，不用path屬性，而是name屬性，來實現命名路由的導航，同時還可以用params屬性傳參；

3、可以給push方法提供一個對象，path屬性指向要跳轉到的地址，通過query屬性傳遞查詢字符串，查詢字符串會通過問號的形式拼接到url地址的后面去。

聲明式導航通過標簽來實現頁面跳轉，編程式導航通過調用js的API來實現跳轉，在vue中最常見的編程式導航API是push函數和go函數，

使用案例：

jumpOther(items, indexValue) {
      // this.$router.push(itemPath);
      if (indexValue) {
        this.$router.push({
          path: '/medContent1',
          query: {
            entityId: items.entityId,
            materialsCode: items.materialsCode,
            batch: items.batch,
            type: items.type,
            Openid: items.openId
          }
        })
      } else {
        this.$router.push({
          path: '/medContent1',
          query: { entityId: items.entityId, materialsCode: items.materialsCode, batch: items.batch, type: items.type, Openid: items.openId }
        })
      }
    },

其中路由規則如下：

{
  path: '/medContent1',
  component: () => import('@/views/medContent/index1')
},

 獲取參數:this.$route.query.entityId。