1. 程式人生 > 其它 >vue-router傳遞引數

vue-router傳遞引數

vue-router傳遞引數分為兩種:

1、程式設計式導航:this.$router.push()

(1)、命名路由傳遞引數需要使用params來傳遞,目標頁面接收傳遞引數時使用params。

  特別注意:命名路由這種方式傳遞的引數,如果在目標頁面重新整理是會出錯的

  params配合name使用

  傳遞引數如下:

頁面接受引數如下:

(2)、查詢引數其實就是在路由地址後面帶上引數和傳統的url引數一致的,傳遞引數使用query而且必須配合path來傳遞引數,目標頁面接收傳遞的引數使用query。重新整理頁面不會出錯

  query配合path使用

  傳遞引數如下:

頁面接受引數如下:

2、宣告式導航:<router-link to=""></router-link>(跟上面規則其實一樣就是寫法不同罷了)

(1)、命名路由傳遞引數需要使用params來傳遞,目標頁面接收傳遞引數時使用params。

(2)、查詢引數其實就是在路由地址後面帶上引數和傳統的url引數一致的,傳遞引數使用query而且必須配合path來傳遞引數,目標頁面接收傳遞的引數使用query。重新整理頁面不會出錯