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 ...
随机推荐
- AEAI HR薪资汇总功能介绍
1 概述 人力资源系统是一个公司重要的管理工具,而薪资管理是人力资源管理系统中最为核心的功能模块,它包括不同员工的薪资标准.薪资的组成部分,例如:对奖惩管理.保险和年假等员工必备的福利待遇进行统一管理 ...
- 利用自定义View实现扫雷游戏
游戏规则: 简单版的扫雷事实上就是一个9×9的矩阵,其中有十个点是雷,非雷方块的数字代表该方块周围八个方块中雷的个数.通过长按某一方块(方块会变红)认定该方块为玩家认为的雷,通过短按某一方块来“展开” ...
- android viewpage预加载和懒加载问题
1.本人理解懒加载和预加载问题某种情况下可以归结为一类问题,下面我就说一下我遇到的预加载问题和懒加载问题及解决的相应方法: - [1 ] 预加载问题 描述:我用到了三个fragment. ...
- django入门与实践 - 关于升级到django 3.7,三种模板超链接配置(编辑中)
第一种方法: 在myblog/urls.py模块中: from django.contrib import admin from django.urls import path, include ur ...
- 章节九、1-Selenium环境配置
一.Selenium环境安装配置,这里使用Selenium WebDriver 3.6.0 1.下载Selenium WebDriver (点击后网站响应比较慢,需要多等等) 2.打开该网址后点击“d ...
- Django2.0 正则表示匹配的简单例子
在Django中,使用正则表达式,匹配Url 默认情况下,url固定格式如下: urlpatterns = [ path('admin/', admin.site.urls), ] 如果需要使用正则表 ...
- Linux 环境下 Git 安装与基本配置
索引: 目录索引 参看代码 GitHub: git.txt 一.Linux (DeepinOS) 环境 1.安装 sudo apt-get update sudo apt-get install gi ...
- C#基础第五天
public struct Person { public string _name; public Gender _sex; public int _age; } public enum Gende ...
- python模块(os,sys,hashlib,collections)
列出目录下所有文件 os.listdir('dirname'):列出指定目录下的所有文件和子目录,包括隐藏文件,并以列表方式返回. 创建文件夹: os.mkdir('文件夹') 创建文件夹 os ...
- c/c++ 多线程 等待一次性事件 std::promise用法
多线程 等待一次性事件 std::promise用法 背景:不是很明白,不知道为了解决什么业务场景,感觉std::async可以优雅的搞定一切的一次等待性事件,为什么还有个std::promise. ...