vue中如何不通过路由直接获取url中的参数
2017-08-23 16:13
811 查看
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")
相关文章推荐
- vue中如何不通过路由直接获取url中的参数
- vue不通过路由直接获取url中参数的方法示例
- 如何在JSP页面上直接获取url的参数呢(不通过controller设置)?
- Vue中的 this.$router.push() 参数获取 (通过路由传参)
- 通过url传递参数时,如何获取全部参数
- 如何从编码过的当前url中通过get获取参数
- Postman 如何传入一个数组形式的参数用来测试URL路由地址
- 详解react如何在组件中获取路由参数
- 日常问题记录--jsp中struts2标签如何获取当前页面的url参数
- Js的Url中传递中文参数乱码,如何获取Url中参数问题
- js获取url中的参数且参数为中文时通过js解码
- asp.net mvc 如何在View中获取Url参数的值
- JS通过Url传递中文参数,c#获取参数
- php 如何获取当前页完整URL及其get参数
- js_html_input中autocomplete="off"在chrom中失效的解决办法 使用JS模拟锚点跳转 js如何获取url参数 C#模拟httpwebrequest请求_向服务器模拟cookie发送 实习期学到的技术(一) LinqPad的变量比较功能 ASP.NET EF 使用LinqPad 快速学习Linq
- react如何在组件中获取路由参数?this.props.params.id
- ASP.NET 页面通过url传递参数,另一页面通过Request.QueryString获取参数为乱码问题
- 日常问题记录--JSP页面中通过<s:property value="#parameters.userName[0]>获取URL参数中文时为乱码的解决办法
- Laravel 5如何在中间件中获取路由参数?
- 通过浏览器的URL获取参数