0

0

vue中qs的两个方法是什么

青灯夜游

青灯夜游

发布时间:2022-12-21 18:19:00

|

2977人浏览过

|

来源于php中文网

原创

qs的两个方法是:1、stringify方法,用于将对象序列化成url形式的字符串,以“&”符号进行拼接,语法“qs.stringify(data)”;2、parse方法,用于将URL形式的字符串解析成对象,语法“qs.parse(data)”。

vue中qs的两个方法是什么

本教程操作环境:windows7系统、vue3版,DELL G3电脑。

一、qs是什么?

qs 是一个增加了一些安全性的查询字符串解析和序列化字符串的库。可以进行对象与字符串之间的一个转换。

二、qs的安装

qs,是axios中自带的,也是npm仓库所管理的包。

安装方式:

立即学习前端免费学习笔记(深入)”;

npm install qs

Vue项目中的导入方式:

import qs from 'qs'

Vue项目中的main.js中设置全局属性的方式:

Vue.prototype.$qs = qs

三、qs应用场景

使用axios,调用后端接口时使用到的。

请求方式为post,axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urllencoded',将对象或数组的参数使用qs.stringify()进行序列化转化

四、qs使用

介绍它的两个方法:stringify和parse。

qs.stringify(data)

stringify方法,是将对象序列化成url形式的字符串,以&符号进行拼接。

onst Qs = require('qs');
let obj= {
 method: "query_sql_dataset_data",
 projectId: "85",
 appToken: "7d22e38e-5717-11e7-907b-a6006ad3dba0",
 datasetId: " 12564701"
};
Qs.stringify(obj);
console.log(Qs.stringify(obj));

如上面代码所示,输出结果如下

1.png

{"uid":"cs11","pwd":"000000als","username":"cs11","password":"000000als"}
uid=cs11&pwd=000000als&username=cs11&password=000000als

qs.parse(data)

parse方法,是将URL形式的字符串解析成对象

示例及输出效果如下:

import qs from 'qs'

const userStr = 'name=xiaoming&password=123456'
//qs.parse(userStr)
console.log('转换后的格式:',qs.parse(userStr))

// Object{
//          name:'xiaoming',
//          password:'123456'
//        }

五、qs与JSON的区别

一直不太了解qs与JSON到底有什么区别?!网上仔细查了一下,总结如下:

家电小商城网站源码1.0
家电小商城网站源码1.0

家电公司网站源码是一个以米拓为核心进行开发的家电商城网站模板,程序采用metinfo5.3.9 UTF8进行编码,软件包含完整栏目与数据。安装方法:解压上传到空间,访问域名进行安装,安装好后,到后台-安全与效率-数据备份还原,恢复好数据后到设置-基本信息和外观-电脑把网站名称什么的改为自己的即可。默认后台账号:admin 密码:132456注意:如本地测试中127.0.0.1无法正常使用,请换成l

下载
qs与JSON的区别


qs JSON
相同点 都是进行对象与字符串之间的转换
异同点 stringif方法 前后端交互时,将对象序列化为url形式的数据,用&拼接

数据转化为正常的json字符串格式

对象数据:{name:'xiaoming',password:'123123'}

转换后数据:

name=xiaoming&password=123123

对象数据:{name:'xiaoming',password:'123123'}

转换后数据:

’{"name":"xiaoming","password":"123123"}‘

parse方法

字符串数据:

name=xiaoming&password=123123

转换后数据:

{name:'xiaoming',password:'123123'}

字符串数据:

’{"name":"xiaoming","password":"123123"}‘

转换后数据:

{name:'xiaoming',password:'123123'}

【相关推荐:vuejs视频教程web前端开发

相关专题

更多
json数据格式
json数据格式

JSON是一种轻量级的数据交换格式。本专题为大家带来json数据格式相关文章,帮助大家解决问题。

402

2023.08.07

json是什么
json是什么

JSON是一种轻量级的数据交换格式,具有简洁、易读、跨平台和语言的特点,JSON数据是通过键值对的方式进行组织,其中键是字符串,值可以是字符串、数值、布尔值、数组、对象或者null,在Web开发、数据交换和配置文件等方面得到广泛应用。本专题为大家提供json相关的文章、下载、课程内容,供大家免费下载体验。

528

2023.08.23

jquery怎么操作json
jquery怎么操作json

操作的方法有:1、“$.parseJSON(jsonString)”2、“$.getJSON(url, data, success)”;3、“$.each(obj, callback)”;4、“$.ajax()”。更多jquery怎么操作json的详细内容,可以访问本专题下面的文章。

306

2023.10.13

go语言处理json数据方法
go语言处理json数据方法

本专题整合了go语言中处理json数据方法,阅读专题下面的文章了解更多详细内容。

74

2025.09.10

js 字符串转数组
js 字符串转数组

js字符串转数组的方法:1、使用“split()”方法;2、使用“Array.from()”方法;3、使用for循环遍历;4、使用“Array.split()”方法。本专题为大家提供js字符串转数组的相关的文章、下载、课程内容,供大家免费下载体验。

248

2023.08.03

js截取字符串的方法
js截取字符串的方法

js截取字符串的方法有substring()方法、substr()方法、slice()方法、split()方法和slice()方法。本专题为大家提供字符串相关的文章、下载、课程内容,供大家免费下载体验。

205

2023.09.04

java基础知识汇总
java基础知识汇总

java基础知识有Java的历史和特点、Java的开发环境、Java的基本数据类型、变量和常量、运算符和表达式、控制语句、数组和字符串等等知识点。想要知道更多关于java基础知识的朋友,请阅读本专题下面的的有关文章,欢迎大家来php中文网学习。

1435

2023.10.24

字符串介绍
字符串介绍

字符串是一种数据类型,它可以是任何文本,包括字母、数字、符号等。字符串可以由不同的字符组成,例如空格、标点符号、数字等。在编程中,字符串通常用引号括起来,如单引号、双引号或反引号。想了解更多字符串的相关内容,可以阅读本专题下面的文章。

609

2023.11.24

小游戏4399大全
小游戏4399大全

4399小游戏免费秒玩大全来了!无需下载、即点即玩,涵盖动作、冒险、益智、射击、体育、双人等全品类热门小游戏。经典如《黄金矿工》《森林冰火人》《狂扁小朋友》一应俱全,每日更新最新H5游戏,支持电脑与手机跨端畅玩。访问4399小游戏中心,重温童年回忆,畅享轻松娱乐时光!官方入口安全绿色,无插件、无广告干扰,打开即玩,快乐秒达!

30

2025.12.31

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
Vue 教程
Vue 教程

共42课时 | 5.7万人学习

Vue3.x 工具篇--十天技能课堂
Vue3.x 工具篇--十天技能课堂

共26课时 | 1.4万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号