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 ...
随机推荐
- 微耕N3000注入
使用ILSpy或Reflector 反编译N3000并导出解决方案,便于搜索方法代码 使用ILDASM生成中间代码D:\app\WG\AccessControl\IL\N3000.il 操作如下:(可 ...
- spring学习总结——高级装配学习四(运行时:值注入、spring表达式)
前言: 当讨论依赖注入的时候,我们通常所讨论的是将一个bean引用注入到另一个bean的属性或构造器参数中.bean装配的另外一个方面指的是将一个值注入到bean的属性或者构造器参数中.在没有学习使用 ...
- 从 RAID 到 Hadoop Hdfs 『大数据存储的进化史』
我们都知道现在大数据存储用的基本都是 Hadoop Hdfs ,但在 Hadoop 诞生之前,我们都是如何存储大量数据的呢?这次我们不聊技术架构什么的,而是从技术演化的角度来看看 Hadoop Hdf ...
- 详解MongoDB中的多表关联查询($lookup)
一. 聚合框架 聚合框架是MongoDB的高级查询语言,它允许我们通过转换和合并多个文档中的数据来生成新的单个文档中不存在的信息. 聚合管道操作主要包含下面几个部分: 命令 功能描述 $projec ...
- JAVA 递归实现从n个数中选取m个数的所有组合
这周Java课程有个小作业:Java递归实现从n个数中选取m个数的所有组合 代码如下: //其中 n 取 1,2,3,4,5 五个数, m 取 3 package javaText; public c ...
- SQLServer之创建视图
视图定义 视图是一个虚拟的表,是一个表中的数据经过某种筛选后的显示方式,视图由一个预定义的查询select语句组成. 使用SSMS数据库管理工具创建视图 1.连接数据库,选择数据库,展开数据库-> ...
- c/c++ 多线程 unique_lock的使用
多线程 unique_lock的使用 unique_lock的特点: 1,灵活.可以在创建unique_lock的实例时,不锁,然后手动调用lock_a.lock()函数,或者std::lock(lo ...
- errno 的使用
error是一个包含在<errno.h>中的预定义的外部int变量,用于表示最近一个函数调用是否产生了错误.若为0,则无错误,其它值均表示一类错误. perror()和strerror() ...
- "'cl' 不是内部或外部命令,也不是可运行的程序"解决方案
最近使用VS2012+Qt5.1+QtCreator2.8.1来搭建Qt的开发环境(之前有用MinGW编译的经历,经常碰到gdb调试器崩溃的问题),全部换成想用VC的编译器和调试环境,但是觉得QtCr ...
- Linux VMware新添加网络适配器找不到配置文件问题
VMware centos 新添加网卡没有识别,在做 Linux 实验时经常遇到需要双网卡的情况,VMware 新添加网卡后Linux是不会主动创建 ifcfg-eth* 文件的,重启服务器和重启网络 ...