vue+webpack+vue-cli获取URL地址参数
在没有使用webpack+vue router开发中,想要获取RUL传的参数地址,直接通过一个函数就可以获得。
比如在 www.test.com/test.html?sign=test 地址中,想要获取sign的值,通常的方法是用一个函数,
var getUrlStr = function(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if(r != null) return unescape(r[2]);
return null;
}
var sign = getUrlStr ("sign");
sign的值就为 test ;
那么问题来了,用router开发,是直接通过路由跳转的页面,那该怎样获取呢?
首先想到的也是通过以上方法获取,但试了一下,表示行不通。通过百度了解到,可以直接使用提供的方法;
就如这样,也是同样的传参 http://localhost:8080/#/one?sign=nsrjbxx
var sign = this.$route.query.sgin ;
this 指的是 vue 对象,所以放在vue的方法中直接使用就行了,sign 是参数,这个是可以自定义的。
理解很潜,简单的能达到目的,有更深的理解欢迎来评!!!
最近发现 可以简单的修改下getUrlStr 函数也是可以实现的
var getUrlStr = function(name){
/**
* 获取地址栏参数
*/
let reg = new RegExp("(^|\\?|&)" + name + "=([^&]*)(\\s|&|$)","i");
if(reg.test(window.location.href)){
return unescape(RegExp.$2.replace(/\+/g," "))
}
return undefined
}
直接通过获取location.href 得到URL的地址,在根据获取参数就ok了!
vue+webpack+vue-cli获取URL地址参数的更多相关文章
- ASP.NET MVC中获取URL地址参数的两种写法
一.url地址传参的第一种写法 1.通过mvc中默认的url地址书写格式:控制器/方法名/参数 2.实例:http://localhost:39270/RequestDemo/Index/88,默认参 ...
- 获取URL地址参数方法
//获取url参数 getQueryVariable(variable){ var query =decodeURIComponent(window.location.search.substring ...
- jquery 获取url地址参数
1 var url = document.URL; 2 var a = url.split("="); 3 4 if(a[1]){ 5 return options.fn(this ...
- JS获取URL地址参数
<script> var url = "http://127.0.0.1/index.php?old_quantity=168&date=1478309879000$id ...
- 准确获取URL地址参数
http://localhost:8080/?state=app&code=021axrkH0Il7Df2bEQkH0DMjkH0axrkP 准确获取code的值 getQueryString ...
- JS动态获取项目名以及获取URL地址中的参数
在项目当中我们可能会遇到例如改变的项目名称之后,相对应的地址就需要改变,为了减少工作量,将地址当中的项目名这一块写成动态获取的,那么最关键一点就是我要先获取它,再进行操作: 知识点整理,话不多说,直接 ...
- vue不通过路由直接获取url中参数的方法示例
vue不通过路由直接获取url中参数的方法示例 vuejs取得URL中参数的值地址:http://localhost:3333/#/index?id=128console.log(this.$rout ...
- js获取当前url地址参数中文乱码问题
网上看了一些关于此问题的文章,都说的不清不楚,有些更是乱七八糟,完全没法看,故此找了一篇能用的,借鉴作为笔记. //首先获取到当前页面的地址栏信息 var url = window.location. ...
- Servlet获取URL地址
这里来说说用Servlet获取URL地址.在HttpServletRequest类里,有以下六个取URL的函数: getContextPath 取得项目名 getServletPath 取得Servl ...
随机推荐
- 当view为wrap_conten时获取一个view的具体宽高
int w = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED); int h = View.MeasureSpec. ...
- Adapter刷新数据的坑
adapter刷新数据的时候,要能够刷新成功,要保证每次刷新的时候都是改变数据源. 于是,我这样做了,在适配器的构造方法里面写到: private List<ListBean> listI ...
- Redis保证事务一致性,以及常用的数据结构
reids命令可以参考中文官网:http://redis.cn/commands.html 关于reids的使用,可以封装到工具类进行调用: Redis的工具类:JedisAdapter 除了数据结构 ...
- [Web][DreamweaverCS6][高中同学毕业分布去向网站+服务器上挂载]一、安装与破解DreamweaverCS6+基本规划
DreamweaverCS6安装与破解 一.背景介绍:同学毕业分布图项目计划简介 哎哎哎,炸么说呢,对于Web前端设计来说,纯手撕html部分代码实在是难受. 对于想做地图这类的就“必须”用这个老工具 ...
- spring学习总结——装配Bean学习二(JavaConfig装配bean)
通过Java代码装配bean 前言:上面梳理了通过注解来隐式的完成了组件的扫描和自动装配,下面来学习下如何通过显式的配置的装配bean: 使用场景:比如说,你想要将第三方库中的组件装配到你的应用中,在 ...
- 定时任务 Cron表达式
Cron表达式由6~7项组成,中间用空格分开.从左到右依次是: 秒.分.时.日.月.周几.年(可省略) Cron表达式的值可以是数字,也可以是以下符号: "*":所有值都匹配 &q ...
- Python操作db2
官方文档:https://www.ibm.com/support/knowledgecenter/en/SSEPGG_9.5.0/com.ibm.db2.luw.apdv.python.doc/doc ...
- 【English】20190315
accelerate 加速 [ækˈsɛləˌret] Our goal is to help you be more successful in your role and work togeth ...
- day 15 模块、起别名、from导入
模块 '''模块:一系列功能的集合体定义模块:创建一个py文件就是一个模块,该py文件名就是模块名使用模块:在要使用模块的文件中,通过 import 模块名 来导入模块 ''''''import ...
- 2019-03-23 shell练习,日志统计
[2019-03-10 17:44:55]1234567 paid 10 10000 cat test.txt |tail -n +1 |sed 's/]/ ]g' |awk '{count[$3]+ ...