Vue路由傳參的3種形式

2021-09-28 12:09:41 字數 887 閱讀 7809

在列表向詳情頁面跳轉，而後在詳情頁面檢視列表的詳情資訊，此時設計路由傳參，vue中有3種傳參形式，介紹如下：

methods：`,})}
此方法，會將引數直接拼接在url上面，需要在路由檔案中配置動態路由，具體的配置如下：

另外，在詳情頁面orderdetails.vue中可以通過 this.$route.params.id 來獲取傳遞的引數，具體如下：

created()
methods：})}
此方法，不會將引數直接拼接在url上面，在路由配置的時候，不需要使用動態路由配置，具體如下：

另外，在詳情頁面orderdetails.vue中可以通過 this.$route.params.id 來獲取傳遞的引數，具體如下：

created()
缺點：頁面重新整理會產生資料丟失的問題。

methods：})}
此方法，會將引數拼接到url上面，並且使用 key=value 的形式，對應的路由不需要配置成動態路由，具體如下：

另外，在詳情頁面 orderdetails.vue 中可以通過 this.$route.query.id 來獲取傳遞的引數，具體如下：

Vue路由傳參的3種形式

在列表向詳情頁面跳轉，而後在詳情頁面檢視列表的詳情資訊，此時設計路由傳參，vue中有3種傳參形式，介紹如下 class action btn click viewdetails item.id 一 path形式 methods 此方法，會將引數直接拼接在url上面，需要在路由檔案中配置動態路由，具體...

VUE路由傳參有3種方式

vue路由傳參有3種方式 1 query方式 push時使用path來匹配 發起頁面 this.katex parse error expected got eof at end of input eturn 跳轉轉收頁面的時候,位址列會顯示 2 params模式 push時使用name來匹配 發起...

vue的路由傳參的3種方式

push 有兩種方式 一種是通過path，一種是通過name。然後無論是path還是name都有params和query方式進行傳遞，如下 type 居住類 this.router.push this.router.push this.router.push this.router.push 到這裡...