首页 > 代码库 > vue中如何不通过路由直接获取url中的参数
vue中如何不通过路由直接获取url中的参数
前言:为什么要不通过路由直接获取url中的参数?
vue中使用路由的方式设置url参数,但是这种方式必须要在路径中附带参数,而且这个参数是需要在vue的路由中提前设置好的。
相对来说,在某些情况下直接在url后面拼接?mid=100的方式传递参数更灵活,你不需要设置路由,只需要在url后拼接参数即可,但是这种方式就需要通过javascript获取并提取url中的参数,通过传统的方式直接在页面中获取是行不通的了,因为vue中是无法通过location.search()来获取url问号之后的内容的。当然,这个问题也有解决方法,就是把获取参数的脚本代码注册成全局方法就可以了。
第一步:创建utils.js文件,并保存到项目根目录
1 export default{ 2 getUrlKey:function(name){ 3 return decodeURIComponent((new RegExp(‘[?|&]‘+name+‘=‘+‘([^&;]+?)(&|#|;|$)‘).exec(location.href)||[,""])[1].replace(/\+/g,‘%20‘))||null; 4 } 5 }
第二步:在主js方法(main.js)中注册全局方法
import utils from ‘./utils‘ //获取url参数
Vue.prototype.$utils=utils //注册全局方法
第三步:vue文件中引用方法
let channel=this.$utils.getUrlKey("channel")
vue中如何不通过路由直接获取url中的参数
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。