CDN 引入 axios 和 qs 及其使用方法

一些小项目,没必要搭建脚手架,直接以cdn的方式引入

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script type="text/javascript" src="https://cdn.bootcss.com/qs/6.7.0/qs.min.js"></script> <script type="text/javascript" src="https://cdn.bootcss.com/axios/0.18.0/axios.min.js"></script> </head> <body> <div> </div> <script type="text/javascript"> //一般引入qs库都赋值为qs,不过浏览器全局引入的是 window.Qs对象, //所以直接用 qs.stringify() 会报 qs undefined //方式1:var qs = Qs qs.stringify() //方式2:Qs.stringify() var qs = Qs // 配置post的请求头 axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded' // qs.stringify() 这里可以做一下封装 axios.post('url', qs.stringify({ id: 1, name: 'lxw' })).then(function (res) { // 返回 Promise对象数据 }) </script> </body> </html>

qs的一些使用方法

qs.parse qs.parse 方法可以把一段格式化的字符串转换为对象格式,比如 let url = 'http://localhost/index.htm?a=1&b=2&c=&d=xxx&e'; let data = qs.parse(url.split('?')[1]); // data的结果是 { a: 1, b: 2, c: '', d: xxx, e: '' } qs.stringify 基本用法 qs.stringify 则和 qs.parse 相反,是把一个参数对象格式化为一个字符串。 let params = { c: 'b', a: 'd' }; qs.stringify(params) // 结果是 'c=b&a=d' 排序 甚至可以对格式化后的参数进行排序: qs.stringify(params, (a,b) => a.localeCompare(b)) // 结果是 'a=b&c=d' 指定数组编码格式 let params = [1, 2, 3]; // indices(默认) qs.stringify({a: params}, { arrayFormat: 'indices' }) // 结果是 'a[0]=1&a[1]=2&a[2]=3' // brackets qs.stringify({a: params}, { arrayFormat: 'brackets' }) // 结果是 'a[]=1&a[]=2&a[]=3' // repeat qs.stringify({a: params}, { arrayFormat: 'repeat' }) // 结果是 'a=1&a=2&a=3' 处理json格式的参数 在默认情况下,json格式的参数会用 [] 方式编码, let json = { a: { b: { c: 'd', e: 'f' } } }; qs.stringify(json); //结果 'a[b][c]=d&a[b][e]=f' 但是某些服务端框架,并不能很好的处理这种格式,所以需要转为下面的格式 qs.stringify(json, {allowDots: true}); //结果 'a.b.c=d&a.b.e=f'

原文链接:https://blog.csdn.net/lw112190/article/details/108142220?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522165934461816782390556177%2522%252C%2522scm%2522%253A%252220140713.130102334.pc%255Fblog.%2522%257D&request_id=165934461816782390556177&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2~blog~first_rank_ecpm_v1~times_rank-23-108142220-null-null.nonecase&utm_term=%E6%90%AD%E5%BB%BAcdn

原创文章,作者:优速盾-小U,如若转载,请注明出处:https://www.cdnb.net/bbs/archives/7920

(0)
上一篇 2022年9月20日 15:02
下一篇 2022年9月20日

相关推荐

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注

优速盾注册领取大礼包www.cdnb.net
/sitemap.xml