主要通過兩種方式傳參

1.query方式傳參和接受參數(shù)

this.$router.push({ path:’/xxx’ query:{ idname:id }})

接收的方式：this.$route.query.id

2.params方式傳遞參數(shù)

this.$router.push({ name:’路徑名稱’ query:{ idname:id }})

接收的方式：this.$route.params.id

代碼

this.$router.push({ path: ’/container’, params: { url: this.func.url, }, });

在跳轉(zhuǎn)后的頁面中console.log(this.route)發(fā)現(xiàn)params是空的

問題原因:用法錯誤,以下為正確用法

this.$router.push({ name: ’container’, params: { url: this.func.url, }, });

要使跳轉(zhuǎn)后的頁面this.$route.params有參數(shù)，必須使用name:’container’，而不是path:’/container’，還需要注意name中沒有/

this.$router.push({ name: ’container’, params: { url: this.func.url, }, });

參數(shù)獲取this.$route.params.url

this.$router.push({ path: ’/container’, query: { url: this.func.url, }, });

這種方式會在跳轉(zhuǎn)的地址上拼接上?url=xxxx獲取方式this.$route.query.url

導(dǎo)致這樣的原因是因為params需要通過name來獲取，這里就要明白query和params的區(qū)別了

query要用path來引入,接收參數(shù)都是this.$route.query.name。query類似于ajax中g(shù)et傳參，即在瀏覽器地址欄中顯示參數(shù)。 params要用name來引入，接收參數(shù)都是this.$route.params.name。params則類似于post，即在瀏覽器地址欄中不顯示參數(shù)。

注意區(qū)別兩種方式，切勿path和name同時出現(xiàn)

到此這篇關(guān)于vue.js this.$router.push獲取不到params參數(shù)問題的文章就介紹到這了,更多相關(guān)this.$router.push獲取參數(shù)內(nèi)容請搜索好吧啦網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持好吧啦網(wǎng)！