我欲封天txt下载,听中国有声小说,盛世嫡妃凤轻小说

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營銷解決方案

在vue中使用query和params傳參的區(qū)別有哪些

本篇文章為大家展示了在vue中使用query和params傳參的區(qū)別有哪些，內(nèi)容簡明扼要并且容易理解，絕對能使你眼前一亮，通過這篇文章的詳細(xì)介紹希望你能有所收獲。

創(chuàng)新互聯(lián)自成立以來，一直致力于為企業(yè)提供從網(wǎng)站策劃、網(wǎng)站設(shè)計、成都網(wǎng)站制作、網(wǎng)站建設(shè)、外貿(mào)網(wǎng)站建設(shè)、電子商務(wù)、網(wǎng)站推廣、網(wǎng)站優(yōu)化到為企業(yè)提供個性化軟件開發(fā)等基于互聯(lián)網(wǎng)的全面整合營銷服務(wù)。公司擁有豐富的網(wǎng)站建設(shè)和互聯(lián)網(wǎng)應(yīng)用系統(tǒng)開發(fā)管理經(jīng)驗、成熟的應(yīng)用系統(tǒng)解決方案、優(yōu)秀的網(wǎng)站開發(fā)工程師團隊及專業(yè)的網(wǎng)站設(shè)計師團隊。

Vue router如何傳參

params、query是什么？

params：/router1/:id ，/router1/123，/router1/789 ,這里的id叫做params

query：/router1?id=123 ,/router1?id=456 ,這里的id叫做query。

路由界面：

router.js:

路由設(shè)置這里，當(dāng)你使用params方法傳參的時候，要在路由后面加參數(shù)名，并且傳參的時候，參數(shù)名要跟路由后面設(shè)置的參數(shù)名對應(yīng)。使用query方法，就沒有這種限制，直接在跳轉(zhuǎn)里面用就可以。

在vue中使用query和params傳參的區(qū)別有哪些

注意：如果路由上面不寫參數(shù)，也是可以傳過去的，但不會在url上面顯示出你的參數(shù)，并且當(dāng)你跳到別的頁面或者刷新頁面的時候參數(shù)會丟失（如下圖所示），那依賴這個參數(shù)的http請求或者其他操作就會失敗。

在vue中使用query和params傳參的區(qū)別有哪些

注意看上面的路由參數(shù)，id這個參數(shù)是我們有設(shè)置在路由上面的，id2我沒有設(shè)置在路由里面，所以刷新之后id2就不見了，在項目中，我們總不可能要求用戶不能刷新吧。

組件1：

編程式導(dǎo)航跳轉(zhuǎn)：

上面的router-link傳參，也可以使用router文檔里面的編程式導(dǎo)航來跳轉(zhuǎn)傳參。

this.$router.push({ name:'router1',params: { id: status ,id2: status3},query: { queryId: status2 }});
//編程跳轉(zhuǎn)寫在一個函數(shù)里面，通過click等方法來觸發(fā)

這兩種傳參效果是一模一樣的，編程式導(dǎo)航，可以用來做判斷跳轉(zhuǎn)，比如是否授權(quán)，是否登錄，等等狀態(tài)，對此不太了解的小伙伴們，可以跳過這個編程式導(dǎo)航，以后再來看。

組件2：

傳參還是比較簡單的，按著上面組件的使用方法就可以成功傳過去了。

提示：獲取路由上面的參數(shù)，用的是$route，后面沒有r。

params傳參和query傳參有什么區(qū)別：

1、用法上的

剛query要用path來引入，params要用name來引入，接收參數(shù)都是類似的，分別是this.$route.query.name和this.$route.params.name。

注意接收參數(shù)的時候，已經(jīng)是$route而不是$router了哦??！

2、展示上的

query更加類似于我們ajax中g(shù)et傳參，params則類似于post，說的再簡單一點，前者在瀏覽器地址欄中顯示參數(shù)，后者則不顯示

query:

在vue中使用query和params傳參的區(qū)別有哪些

params: 在vue中使用query和params傳參的區(qū)別有哪些

3、params是路由的一部分,必須要有。query是拼接在url后面的參數(shù)，沒有也沒關(guān)系。

params一旦設(shè)置在路由，params就是路由的一部分，如果這個路由有params傳參，但是在跳轉(zhuǎn)的時候沒有傳這個參數(shù)，會導(dǎo)致跳轉(zhuǎn)失敗或者頁面會沒有內(nèi)容。

比如：跳轉(zhuǎn)/router1/:id

正確
錯誤

4、params、query不設(shè)置也可以傳參，params不設(shè)置的時候，刷新頁面或者返回參數(shù)會丟失

上述內(nèi)容就是在vue中使用query和params傳參的區(qū)別有哪些，你們學(xué)到知識或技能了嗎？如果還想學(xué)到更多技能或者豐富自己的知識儲備，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

新聞標(biāo)題：在vue中使用query和params傳參的區(qū)別有哪些
路徑分享：http://fisionsoft.com.cn/article/gecehe.html

新聞中心

從這個路由傳參到別的路由

接收參數(shù)的路由

params.id：{{ $route.params }}

query.status:{{ $route.query.queryId }}

其他資訊