URLSearchParams 接口定义了很多个用来处理 URL 参数串的方法

他可以把对象转变成url上面查询信息的写法,例如a=1&b=2

可以把请求路由中的字符串   key=1 ,拼接成key:1   键值对格式,这样方便后端直接使用

用法:

配合fetch使用

btn.onclick = function(){
let obj = {
user:user.value,
age:age.value
}
fetch('/users',{
method:'post',
headers:{'Content-Type':'application/x-www-form-urlencoded'},
body:new URLSearchParams(obj).toString()
})
.then(d=>d.json())
.then(d=>{
console.log(d);
})
}

配合axios使用

const params = new URLSearchParams()
params.append('date', '2019')
params.append('date', '8')
params.append('date', '13')
axios({ method: 'get', url: '/',
params
})
.then((res) => { console.log(res.status) //
})// 请求链接为:http://localhost:8081/?date=2019&date=8&date=13

URLSearchParams 接口的更多相关文章

  1. URLSearchParams接口用来处理浏览器的url

    URLSearchParams 接口定义了一些实用的方法来处理 URL 的查询字符串. URLSearchParams.append()插入一个指定的键/值对作为新的搜索参数. URLSearchPa ...

  2. URLSearchParams 接口定义处理 URL 参数串

    基本使用方法如下 /* * URLSearchParams属性 * @语法:new URLSearchParams(parameter); */ (function(){ var str = &quo ...

  3. 一种快速构造和获取URL查询参数的方法:URLSearchParams

    URLSearchParams 接口定义了一些实用的方法来处理 URL 的查询字符串. URLSearchParams()是个构造函数,将返回一个可以操作查询字符串的对象. 常用方法: 1.构造查询字 ...

  4. new URLSearchParams( )用法说明

    URLSearchParams 接口定义了一些实用的方法来处理 URL 的查询字符串. 方法:该接口不继承任何属性. URLSearchParams.append() 插入一个指定的键/值对作为新的搜 ...

  5. 关于 FormData 和 URLSearchParams

    一.FormData FormData 接口提供了一种表示表单数据的键值对的构造方式,经过它的数据可以使用 XMLHttpRequest.send() 方法送出,本接口和此方法都相当简单直接.如果送出 ...

  6. URLSearchParams/FormData

    一.URLSearchParams()(很好用,但有一定兼容问题,未来版本的浏览器中该功能的语法和行为可能随对应的标准文档而改变.) URLSearchParams 接口定义了一些实用的方法来处理 U ...

  7. JavaScript的URLSearchParams方法

    URLSearchParams 接口定义了一些实用的方法来处理 URL 的查询字符串. 一个实现了 URLSearchParams 的对象可以直接用在 for…of 结构中,不需要使用 entries ...

  8. axios,vue-axios在项目中的应用

    Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中 关于axios的功能: 1,从浏览器中创建XMLHttpRequests 2,从node.js常见Htt ...

  9. Axios 使用时遇到的问题

    最近使用 vue 构建一个小项目,在使用 axios 发送 post 请求的时候,发现 axios 发送数据默认使用 json 格式,百度搜了下,更改 ContentType 不管用,最终问题原来是: ...

随机推荐

  1. 自学华为IoT物联网_09 OceanConnect业务流程

    点击返回自学华为IoT物流网 自学华为IoT物联网_09 OceanConnect业务流程 1.  物流网重要的连个协议介绍 1.1  重要物联网协议介绍----MQTT MQTT(消息队列遥测传输) ...

  2. [WC2008]游览计划(状压dp)

    题面太鬼畜不粘了. 题意就是给一张n*m的网格图,每个点有点权,有k个关键点,让你把这k个关键点连成一个联通快的最小代价. 题解 这题nmk都非常小,解法肯定是状压,比较一般的解法插头dp,但不太好写 ...

  3. pandas to_excel

    报错:IllegalCharacterError 其原因是字段中包含了unicode字符. 解决方案: # 首先,安装python包xlsxwriter pip install xlsxwriter ...

  4. PID 通俗解释

    PID 控制原理3 个故事:看完您就明白了.1.: PID 的故事小明接到这样一个任务:有一个水缸点漏水(而且漏水的速度还不一定固定不变),要求水面高度维持在某个位置,一旦发现水面高度低于要求位置,就 ...

  5. RHEL7下用本地光盘或镜像iso文件做yum源

    应用场境:Redhat 系统想要直接在线通过yum的条件时需要注册,一般用户都是非注册的,这个时候如果要想通过yum安装新软件,我们可以通过将安装盘或者镜像iso文件设置为yum源的方式来进行. 测试 ...

  6. htmlunit 导致高cup占用,一老内存溢出的解决办法

    原文:http://blog.csdn.net/qq_28384353/article/details/52974432#reply 将爬虫部署到服务器上运行后,在查看服务器的状态监控时发现,天猫爬虫 ...

  7. Privoxy将Socks代理转化HTTP代理

    使用步骤 安装Privoxy sudo pacman -S privoxy # Arch Linux 创建配置文件 mkdir -p ~/.config/privoxy 向~/.config/priv ...

  8. 洛谷P1041 传染病控制

    解:搜索...... 我们可以每次选择分支少的搜索,或者说,贪心的搜索当前更优的决策. 每一层把能剪的点搞出来,按照度数/SIZ排序,然后依次搜索.加个最优化剪枝就完事了. #include < ...

  9. PHP的SQL语句优化

    (转)仅供自己学习,特此转发 普遍遇到的慢SQL有以下三种: 1.未走索引 2.where条件里包含子查询,多表联查 3.查询大量数据 解决 一.索引:SQL中的高速公路 但凡优化SQL,首先要看的就 ...

  10. Day032--Python--操作系统, process进程

    多道技术背景: 提高工作效率(充分利用I/O阻塞的时间)    (I: input, O: output) 同时执行多个任务 多道技术: 空间复用: 充分利用内存空间 时间复用: 充分利用I/O阻塞时 ...