- 所在位置：
- 首頁 >
- 編程技術(shù) >
- JavaScript >
- vue怎樣獲取url參數(shù)?教你兩種方法
vue怎樣獲取url參數(shù)?教你兩種方法
Admin 2022-03-22 群英技術(shù)資訊 15405 次瀏覽
這篇文章給大家分享的是vue怎樣獲取url參數(shù)的內(nèi)容。下面介紹了兩種方法，文中示例代碼介紹的非常詳細，感興趣的朋友接下來一起跟隨小編看看吧。
第一種：
const query = Qs.parse(location.search.substring(1))
let passport = query.passport;
第二種：
var query=this.$route.query;
let lat = query.lat;
補充知識：Vue通過query獲取路由參數(shù)
現(xiàn)在來講Vue通過query獲取路由參數(shù)
可以看見com1組件里的路由參數(shù)為 name=zhangsan&job=teacher
使用 this.$route.query 來獲取路由參數(shù)
現(xiàn)在就是利用query直接獲取路由參數(shù)并且以對象的形式展現(xiàn)出來
點擊按鈕之后，查看控制臺，可以看見：
路由參數(shù)以對象的形式展現(xiàn)了出來
但是query獲取的參數(shù)要注意一個問題：不可以直接渲染 query的路由參數(shù)對象，不然會報錯
比如：我想在頁面上直接打印query獲取的路由參數(shù)對象
會報這樣的錯誤：
error in render 說明這是渲染錯誤
雖然不能渲染query獲取的路由參數(shù)對象，但是可以渲染query獲取的路由參數(shù)對象的屬性值
例如：
成功渲染
控制臺也不報錯。
以上就是vue怎樣獲取url參數(shù)的兩種方法介紹，需要的朋友可以參考，希望對大家學習vue框架有幫助，想要了解更多可以繼續(xù)瀏覽群英網(wǎng)絡其他相關(guān)的文章。
文本轉(zhuǎn)載自腳本之家
相關(guān)閱讀：
vue如何實現(xiàn)篩選功能？思路分析及代碼詳解
vue可拖拽進度條效果如何實現(xiàn)？
vue修改網(wǎng)站圖標的方法和流程是什么？
vuex的使用步驟是什么？一文帶你快速了解vuex的用法
淺談vue框架實用技巧，一文帶你快速上手
vue清除定時器的方法是什么？哪些要注意？
免責聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點不代表本網(wǎng)站立場，如果涉及侵權(quán)請聯(lián)系站長郵箱：[email protected]進行舉報，并提供相關(guān)證據(jù)，查實之后，將立刻刪除涉嫌侵權(quán)內(nèi)容。
猜你喜歡
-
node的單線程和單進程概念是什么，如何實現(xiàn)多進程的
Node.js的進程管理??node遵循的是單線程單進程的模式，node的單線程是指js的引擎只有一個實例，且在nodejs的主線程中執(zhí)行，同時node以事件驅(qū)動的方式處理IO等異步操作。node的單線程模式，只維持一個主線程，大大減少了線程間切換的開銷。??但是node的單線程使得在主線程不能進行CPU密集型操作，否則會阻塞主線程。對于CPU密集型操作，在node中通過child_proce
-
JS項目中的并發(fā)請求控制是什么意思，怎么做
這篇文章主要介紹了JavaScript/TypeScript 實現(xiàn)并發(fā)請求控制，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
-
React中怎樣實現(xiàn)頁面跳轉(zhuǎn)，有多少方法？
這篇文章給大家分享的是React中實現(xiàn)頁面跳轉(zhuǎn)的方法，文中給大家介紹了三種方法。小編覺得挺實用的，因此分享給大家做個參考，文中的示例代碼介紹得很詳細，有需要的朋友可以參考，接下來就跟隨小編一起了解看看吧。
-
Node.JS中Path模塊的具體實例是怎樣的，如何用
varpath=require('path');//當發(fā)現(xiàn)有多個連續(xù)的斜杠時，會替換成一個；當路徑末尾包含斜杠時，會保留；//在Windows系統(tǒng)會使用反斜杠。varp=path.normalize('foo/bar//baz/asdf/quux/..');varp2=path.normalize('foo/bar//baz/asdf/quux/../')
-
React中useRef的用法有什么？怎樣實現(xiàn)？
React中useRef的用法有什么？如果有使用過React的朋友，應該對ref會比較熟悉的點，ref可以用來獲取組件實例對象或者是DOM對象，而useRef這個hooks函數(shù)，除了傳統(tǒng)的用法之外，它還可以“跨渲染周期”保存數(shù)據(jù)。那么具體怎樣用呢？下面我們就一起來了解看看。
推薦內(nèi)容
- CSS中flex布局如何實現(xiàn)自動換行？
- 在HTML中如何讓button居中，有幾種方法
- JS中怎樣刪除數(shù)組末尾元素？教你兩種方法
- vue怎樣獲取url參數(shù)?教你兩種方法
- 如何用Python計算BMI指數(shù)？一文帶你看懂
- python怎樣獲取數(shù)組元素的下標？教你三種方法
- python中的ord函數(shù)有什么用？用法是什么？
- Python中array與list轉(zhuǎn)換如何做，方法是什么
- 在CSS中怎么實現(xiàn)一條橫線，方法是什么
- Python怎樣設計串口之間通信的程序
- phpstorm怎么使用和操作？一文帶你快速了解
- vue怎么給對象數(shù)組賦值？this.$set方法幫你解決
相關(guān)標簽
- 出路在哪
- php錯誤和異常
- php去掉deprecated
- python字符串格式化
- python實現(xiàn)PyEMD
- pyecharts繪制雷達圖
- matplotlib創(chuàng)建圖表
- php轉(zhuǎn)換數(shù)據(jù)類型方法
- Function 創(chuàng)建函數(shù)
- mongostat怎么使用
- python編程核心
- PyQt5?pdf轉(zhuǎn)word
- datetime64[ns]轉(zhuǎn)日期
- sql數(shù)據(jù)庫備份還原
- CDN歸納理解
- HTML表單居中
- 子組件設置ref
- 權(quán)重
- python實現(xiàn)貪吃蛇
- CentOS系統(tǒng),Java環(huán)境
- Python可變集合
成為群英會員,開啟智能安全云計算之旅
立即注冊關(guān)注或聯(lián)系群英網(wǎng)絡
7x24小時售前：400-678-4567
7x24小時售后：0668-2555666
24小時QQ客服
群英微信公眾號
CNNIC域名投訴舉報處理平臺
服務電話：010-58813000
服務郵箱：[email protected]
投訴與建議：0668-2555555
Copyright ? QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版權(quán)所有
增值電信經(jīng)營許可證 : B1.B2-20140078 ICP核準（ICP備案）粵ICP備09006778號 域名注冊商資質(zhì) 粵 D3.1-20240008
