vue中如何不通过路由直接获取url中的参数

发布时间:2016-12-6 7:15:19编辑:www.fx114.net 分享查询网我要评论
本篇文章主要介绍了"vue中如何不通过路由直接获取url中的参数 ",主要涉及到vue中如何不通过路由直接获取url中的参数 方面的内容,对于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)中注册全局方法

1 import utils         from './utils'             //获取url参数2 3 Vue.prototype.$utils=utils            //注册全局方法

第三步:vue文件中引用方法

1 let channel=this.$utils.getUrlKey("channel")


上一篇:做正确的事
下一篇:小程序十:媒体组件

相关文章

相关评论

本站评论功能暂时取消,后续此功能例行通知。

一、不得利用本站危害国家安全、泄露国家秘密,不得侵犯国家社会集体的和公民的合法权益,不得利用本站制作、复制和传播不法有害信息!

二、互相尊重,对自己的言论和行为负责。

好贷网好贷款