URLSearchParams 接口
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 接口的更多相关文章
- URLSearchParams接口用来处理浏览器的url
URLSearchParams 接口定义了一些实用的方法来处理 URL 的查询字符串. URLSearchParams.append()插入一个指定的键/值对作为新的搜索参数. URLSearchPa ...
- URLSearchParams 接口定义处理 URL 参数串
基本使用方法如下 /* * URLSearchParams属性 * @语法:new URLSearchParams(parameter); */ (function(){ var str = &quo ...
- 一种快速构造和获取URL查询参数的方法:URLSearchParams
URLSearchParams 接口定义了一些实用的方法来处理 URL 的查询字符串. URLSearchParams()是个构造函数,将返回一个可以操作查询字符串的对象. 常用方法: 1.构造查询字 ...
- new URLSearchParams( )用法说明
URLSearchParams 接口定义了一些实用的方法来处理 URL 的查询字符串. 方法:该接口不继承任何属性. URLSearchParams.append() 插入一个指定的键/值对作为新的搜 ...
- 关于 FormData 和 URLSearchParams
一.FormData FormData 接口提供了一种表示表单数据的键值对的构造方式,经过它的数据可以使用 XMLHttpRequest.send() 方法送出,本接口和此方法都相当简单直接.如果送出 ...
- URLSearchParams/FormData
一.URLSearchParams()(很好用,但有一定兼容问题,未来版本的浏览器中该功能的语法和行为可能随对应的标准文档而改变.) URLSearchParams 接口定义了一些实用的方法来处理 U ...
- JavaScript的URLSearchParams方法
URLSearchParams 接口定义了一些实用的方法来处理 URL 的查询字符串. 一个实现了 URLSearchParams 的对象可以直接用在 for…of 结构中,不需要使用 entries ...
- axios,vue-axios在项目中的应用
Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中 关于axios的功能: 1,从浏览器中创建XMLHttpRequests 2,从node.js常见Htt ...
- Axios 使用时遇到的问题
最近使用 vue 构建一个小项目,在使用 axios 发送 post 请求的时候,发现 axios 发送数据默认使用 json 格式,百度搜了下,更改 ContentType 不管用,最终问题原来是: ...
随机推荐
- MT【256】2016四川高考解答压轴题
(2016四川高考数学解答压轴题)设函数$f(x)=ax^2-a-\ln x,a\in R$. 1)讨论$f(x)$的单调性;2)确定$a$的所有可能值,使得$f(x)>\dfrac{1}{x} ...
- CS academy Binary Flips(dp)
开学啦,没啥时间写博客..过几天就能又停课啦qwq 做点中等 \(dp\) 题来找找 noip 的感觉 233 题意 原题戳这里. 给你一个 \(n \times m\) 的矩阵 \(A\) ,一开始 ...
- 【BZOJ5303】[HAOI2018]反色游戏(Tarjan,线性基)
[BZOJ5303][HAOI2018]反色游戏(Tarjan,线性基) 题面 BZOJ 洛谷 题解 把所有点全部看成一个\(01\)串,那么每次选择一条边意味着在这个\(01\)串的基础上异或上一个 ...
- docker-网络基础
网络 Docker 网络从覆盖范围可分为单个 host 上的容器网络和跨多个 host 的网络 Docker 安装时会自动在 host 上创建三个网络, ⚡ root@bogon /home ...
- hexo报错集锦
1.报错信息如下 FATAL Something's wrong. Maybe you can find the solution here: http://hexo.io/docs/troubles ...
- luogu3621 城池攻占 (倍增)
好像所有人都写的左偏树 但我不会啊233 首先发现乘的时候 系数不会为负,所以能得到一个关键条件:变化后的战斗力随变化前的战斗力大小单调 所以我们考虑倍增 设hp[x][i]是从x开始一路攻克$2^i ...
- TJOI2011书架(dp)
当农夫约翰闲的没事干的时候,他喜欢坐下来看书.多年过去,他已经收集了 N 本书 (1 <= N <= 100,000), 他想造一个新的书架来装所有书. 每本书 i 都有宽度 W(i) 和 ...
- wampserver安装之后出现“无法启动,因为计算机中丢失了msvr110.dll”
1.是因为计算机缺失包所致,我的解决办法是安装一个包来解决. 2.网址如下:下载网址 3.下载完之后,然后安装就是(根据自己的系统版本来选择合适的安装版本).
- 加密解密DES之Android、IOS、C#实现
Android实现 package com.sto.express.utils; import java.security.MessageDigest; import java.security.sp ...
- Command `bundle` unrecognized. Make sure that you have run `npm install` and that you are inside a react-native project.
呃呃,在写下面的代码时出现的问题,解决办法是npm install或者yarn,如果yarn报错,再npm install就可以了 下面的是携程App首页的样式,有轮播,我没有实现出来 代码如下: / ...