这篇“Vue怎么获取url路由地址和参数”文章的知识点大部分人都不太理解，所以小编给大家总结了以下内容，内容详细，步骤清晰，具有一定的借鉴价值，希望大家阅读完这篇文章能有所收获，下面我们一起来看看这篇“Vue怎么获取url路由地址和参数”文章吧。
实例：http://www.myurl.com:8866/test?id=123&username=xxx
当前URL
计算
安全
数据库
网络和加速
企业服务
window.location.href
结果：http://www.myurl.com:8866/test?id=123&username=xxx协议
window.location.protocol
结果：http域名 + 端口
window.location.host
结果：www.myurl.com:8866域名
window.location.hostname（）
结果：www.myurl.com端口
window.location.port（）
结果：8866路径部分
window.location.pathname（） 结果：/test
请求的参数
window.location.search
结果：?id=123&username=xxx备注：获取参数
// var url="www.baidu.com?a=1&b=2&C=3";//测试地址
/*
* 分析：最前面是?或&，紧跟着除 ?&#以外的字符若干
* 然后再等号，最后再跟着除 ?&#以外的字符
* 并且要分组捕获到【除?&#以外的字符】
*/
var reg=/[?&]([^?&#]+)=([^?&#]+)/g;
var param={};
var ret = reg.exec(url);
while(ret){ // 当ret为null时表示已经匹配到最后了，直接跳出
param[ret[1]]=ret[2];
ret = reg.exec(url);
}
console.log(param)获取’?'前边的URL
window.location.origin（）
结果：http://www.myurl.com:8866获取#之后的内容
window.location.hash
结果：nullthis.$route
this.$route.fullPath
this.$route.hash
this.$route.matched
this.$route.meta
this.$route.params
this.$route.query
vue获取地址栏地址url截取参数 方法 （新建js文件）
export function UrlSearch(){<!--{cke_protected}{C}%3C!%2D%2D%20%2D%2D%3E-->
let name,value,str=location.href,num=str.indexOf("?"); //取得整个地址栏
str=str.substr(num+1); //取得所有参数 stringvar.substr(start [, length ]
let arr=str.split("&"); //各个参数放到数组里
console.log(arr)
for(let i=0;i < arr.length;i++){<!--{cke_protected}{C}%3C!%2D%2D%20%2D%2D%3E-->
num=arr[i].indexOf("=");
if(num>0){<!--{cke_protected}{C}%3C!%2D%2D%20%2D%2D%3E-->
name=arr[i].substring(0,num);
value=arr[i].substr(num+1);
this[name]=value;
}
}
}在main.js引入
挂载到全局
使用
以上就是关于“Vue怎么获取url路由地址和参数”这篇文章的内容，相信大家都有了一定的了解，希望小编分享的内容对大家有帮助，若想了解更多相关的知识内容，请关注亿速云行业资讯频道。
亿速云「云服务器」，即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘，价格低至29元/月。点击查看>>
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
原文链接：https://blog.csdn.net/weixin_35773751/article/details/127858668
