在没有使用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地址参数的更多相关文章

  1. ASP.NET MVC中获取URL地址参数的两种写法

    一.url地址传参的第一种写法 1.通过mvc中默认的url地址书写格式:控制器/方法名/参数 2.实例:http://localhost:39270/RequestDemo/Index/88,默认参 ...

  2. 获取URL地址参数方法

    //获取url参数 getQueryVariable(variable){ var query =decodeURIComponent(window.location.search.substring ...

  3. jquery 获取url地址参数

    1 var url = document.URL; 2 var a = url.split("="); 3 4 if(a[1]){ 5 return options.fn(this ...

  4. JS获取URL地址参数

    <script> var url = "http://127.0.0.1/index.php?old_quantity=168&date=1478309879000$id ...

  5. 准确获取URL地址参数

    http://localhost:8080/?state=app&code=021axrkH0Il7Df2bEQkH0DMjkH0axrkP 准确获取code的值 getQueryString ...

  6. JS动态获取项目名以及获取URL地址中的参数

    在项目当中我们可能会遇到例如改变的项目名称之后,相对应的地址就需要改变,为了减少工作量,将地址当中的项目名这一块写成动态获取的,那么最关键一点就是我要先获取它,再进行操作: 知识点整理,话不多说,直接 ...

  7. vue不通过路由直接获取url中参数的方法示例

    vue不通过路由直接获取url中参数的方法示例 vuejs取得URL中参数的值地址:http://localhost:3333/#/index?id=128console.log(this.$rout ...

  8. js获取当前url地址参数中文乱码问题

    网上看了一些关于此问题的文章,都说的不清不楚,有些更是乱七八糟,完全没法看,故此找了一篇能用的,借鉴作为笔记. //首先获取到当前页面的地址栏信息 var url = window.location. ...

  9. Servlet获取URL地址

    这里来说说用Servlet获取URL地址.在HttpServletRequest类里,有以下六个取URL的函数: getContextPath 取得项目名 getServletPath 取得Servl ...

随机推荐

  1. 手机端两端对齐,兼容ios,安卓

    .div-title p label{ text-align: justify; width: 18%; display: inline-block; text-align-last: justify ...

  2. iOS----------使用cocoapods遇到的问题

    -bash: /usr/local/bin/pod: /System/Library/Frameworks/Ruby.framework/Versions/2.0/usr/bin/ruby: bad ...

  3. 从Linux上传到Git过程

    1.1 实验内容 本次课程讲的是在实验楼的在线环境中,如何使用 Github 去管理在在线环境中使用的代码.配置.资源等实验相关文件,怎样去添加.同步和下拉在远程仓库中的实验文件,以此来维持自身的实验 ...

  4. idea上使用maven入门(二)——本地仓库以及使用maven

    本地仓库: 首先创建完一个项目之后,点击左上角file->setting(建一个文件夹repository,建议创建到maven的外面,主要如果maven需要换版本,方便管理)如下图: ​ ma ...

  5. 关于使用阿里OSS服务搭建图床和使用PicGO上传图片到图床

    最近喜欢上了使用markdown来写博客,可是markdown的图片却是本地的,如果我要发博客,那么又要重复截图了.于是干脆弄了个图床,本地截图的时候上传到图床,markdown中的代码结果也是图床里 ...

  6. geth搭建私有网络

    geth --rpc --unlock "3ae88fe370c39384fc16da2c9e768cf5d2495b48,81063419f13cab5ac090cd8329d8fff9f ...

  7. vue实现打印功能的两种方法

    第一种方法:通过npm 安装插件 1,安装  npm install vue-print-nb --save 2,引入  安装好以后在main.js文件中引入 import Print from 'v ...

  8. Cs231n-assignment 2作业笔记

    assignment 2 assignment2讲解参见: https://blog.csdn.net/BigDataDigest/article/details/79286510 http://ww ...

  9. LeetCode算法题-Non-decreasing Array(Java实现)

    这是悦乐书的第283次更新,第300篇原创 01 看题和准备 今天介绍的是LeetCode算法题中Easy级别的第151题(顺位题号是665).给定一个包含n个整数的数组,您的任务是通过修改最多1个元 ...

  10. 周末班:Python基础之模块

    什么是模块 什么是模块? 常见的场景:一个模块就是一个包含了python定义和声明的文件,文件名就是模块名字加上.py的后缀. 但其实import加载的模块分为四个通用类别: 1 使用python编写 ...