export class Router {
ReplaceState(url, data) {
var query = this.Generate(data);
window.history.replaceState(url, "", query)
} /**
* 生成url
*/
Generate(data) {
var search = "?";
for (var temp in data) {
search += `${temp}=${data[temp]}&`;
}
search = search.substr(0, search.length - 1);
return search;
} /**
* 解析search
*/
UrlSearch(key) {
var search = window.location.search;
if (search) {
var searchObject = {};
var queries = search.replace(/^\?/, '').split('&');
for (var i = 0; i < queries.length; i++) {
var split = queries[i].split('=');
if (split[0] != "" && split[1] !== undefined) {
searchObject[split[0]] = decodeURIComponent(split[1]);
}
}
return searchObject[key];
} else {
return "";
}
} }

使用例子:

  添加:

    在window.location.href后加上a=1和b=2。

Router.prototype.ReplaceState(window.location.href, {a:1,b:2});

    修改之后将会变成xxxxxxxxxx?a=1&b=2。

  获取参数:

Router.prototype.UrlSearch("a");

用replaceState操作路由的方法封装的更多相关文章

  1. python3+Appium自动化07-滑动操作以及滑动方法封装

    滑动解析 滑动主要分为:水平滑动.垂直滑动.任意方向滑动 滑动轨迹 在Appium中模拟用户滑动操作需要使用swipe方法,该方法定义如下: def swipe(self, start_x, star ...

  2. 封装JDBC操作数据库的方法

    自己动手封装java操作数据库的方法: 一:目录结构 二:所需依赖的第三方jar包 这里只需引入mysql-connector-java-5.1.8-bin.jar,mysql数据库驱动jar包 三: ...

  3. 记录python接口自动化测试--把操作excel文件的方法封装起来(第五目)

    前面补充了如何来操作excel文件,这次把如何获取excel文件的sheet对象.行数.单元格数据的方法进行封装,方便后面调用 handle_excel.py# coding:utf-8 import ...

  4. selenium3 web自动化测试框架 二:页面基础操作、元素定位方法封装、页面操作方法封装

    学习目的: 掌握自动化框架中需要的一些基础web操作 正式步骤: 使用title_contains检查页面是否正确 # -*- coding:utf-8 -*- import time from se ...

  5. Vlan 间路由的方法

    vlan间路由的方法主要有三种 1.通过路由器上多个接口实现 2.通过路由器上一个接口即单臂路由实现 3.通过三层交换实现   下面将每一中实现方法配合实验说明     第一:通过路由器上多个接口实现 ...

  6. Redis操作Set工具类封装,Java Redis Set命令封装

    Redis操作Set工具类封装,Java Redis Set命令封装 >>>>>>>>>>>>>>>>& ...

  7. Redis操作List工具类封装,Java Redis List命令封装

    Redis操作List工具类封装,Java Redis List命令封装 >>>>>>>>>>>>>>>> ...

  8. Redis操作Hash工具类封装,Redis工具类封装

    Redis操作Hash工具类封装,Redis工具类封装 >>>>>>>>>>>>>>>>>> ...

  9. C#基础之操作字符串的方法

    C#基础之操作字符串的方法 C#中封装的对字符串操作的方法很多,下面将常见的几种方法进行总结: 首先定义一个字符串str 1.str.ToCharArray(),将字符串转换成字符数组 2.str.S ...

随机推荐

  1. caffe特征提取/C++数据格式转换

    Caffe生成的数据分为2种格式:Lmdb 和 Leveldb 它们都是键/值对(Key/Value Pair)嵌入式数据库管理系统编程库. 虽然lmdb的内存消耗是leveldb的1.1倍,但是lm ...

  2. 用apt-get install一个软件的时候出现错误: 无法解析或打开软件包的列表或是状态文件

    用apt-get install一个软件的时候出现了一个错误: E: Encountered a section with no Package: header E: Problem with Mer ...

  3. 洛谷P3111 [USACO14DEC]牛慢跑Cow Jog_Sliver 性质分析

    Code: #include<cstdio> #include<algorithm> #include<cstring> using namespace std; ...

  4. Linux 内核链表 list.h 的使用

    Linux 内核链表 list.h 的使用 C 语言本身并不自带集合(Collection)工具,当我们需要把结构体(struct)实例串联起来时,就需要在结构体内声明指向下一实例的指针,构成所谓的& ...

  5. twemproxy 安装与配置

    转自:http://blog.csdn.net/u011183653/article/details/21240749 说到twemproxy就不得不说要一下redis,这是因为twemproxy是为 ...

  6. JavaScript 三要素

    一个完整的JavaScript 实现由3部分组成: ECMACcript ECMAScript 规定了这门语言的下列组成部分: 语法 类型 语句 关键字.保留字 操作符 对象为什么要使用DOM?   ...

  7. 2、Ansible配置文件详解

    0.配置文件 两个核心文件:ansible.cfg和hosts文件,默认都存放在/etc/ansible目录下. ansible.cfg:主要设置一些ansible初始化的信息,比如日志存放路径.模块 ...

  8. USB OTG学习笔记

    仅仅看了半天SPEC写的笔记,有些乱,等调试完毕再次整理,思路不是很成熟,推测成分较多,可能有不对的地方,欢迎拍砖交流指正.   1. 概要     OTG设备使用插头中的ID引脚来区分A/B Dev ...

  9. Tensorflow 之物体检测

    1)安装Protobuf TensorFlow内部使用Protocol Buffers,物体检测需要特别安装一下. # yum info protobuf protobuf-compiler 2.5. ...

  10. nginx反向代理时保持长连接

    ·[场景描述] HTTP1.1之后,HTTP协议支持持久连接,也就是长连接,优点在于在一个TCP连接上可以传送多个HTTP请求和响应,减少了建立和关闭连接的消耗和延迟. 如果我们使用了nginx去作为 ...