您好,登錄后才能下訂單哦!
這篇文章主要為大家展示了“vue中路由參數傳遞的示例分析”,內容簡而易懂,條理清晰,希望能夠幫助大家解決疑惑,下面讓小編帶領大家一起研究并學習一下“vue中路由參數傳遞的示例分析”這篇文章吧。
首先我的路由的定義
{ path: '/b', name: 'B', component: resolve => require(['../pages/B.vue'], resolve) }
我從A組件跳轉到B組件,并通過路由信息對象傳遞一些參數
this.$router.push({ path: '/b', params: { paramA: 'a' }, query:{ paramB: 'b' } })
在B組件中獲取參數
this.$route.query.paramB //b this.$route.params.paramA //undefined
通過路由的params對象傳遞過來的參數paramB始終是undefined,始終找不到原因。通過查閱資料,終于找到原因,那是因為路由的params對象使用,必須要通過路由名來調用路由,而不同通過path來調用,而query對象則沒有這個要求。
所以我們修改下代碼:
this.$router.push({ name: 'B', params: { paramA: 'a' }, query:{ paramB: 'b' } })
將path參數換成對應的路由名稱就可以了,這個時候獲取參數就一切正常了。
this.$route.query.paramB //b this.$route.params.paramA //a
以上是“vue中路由參數傳遞的示例分析”這篇文章的所有內容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內容對大家有所幫助,如果還想學習更多知識,歡迎關注億速云行業資訊頻道!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。