本篇內(nèi)容主要講解“vue中qs的兩個(gè)方法怎么用”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實(shí)用性強(qiáng)。下面就讓小編來帶大家學(xué)習(xí)“vue中qs的兩個(gè)方法怎么用”吧!

創(chuàng)新互聯(lián)專注于山丹網(wǎng)站建設(shè)服務(wù)及定制，我們擁有豐富的企業(yè)做網(wǎng)站經(jīng)驗(yàn)。 熱誠為您提供山丹營銷型網(wǎng)站建設(shè)，山丹網(wǎng)站制作、山丹網(wǎng)頁設(shè)計(jì)、山丹網(wǎng)站官網(wǎng)定制、小程序開發(fā)服務(wù)，打造山丹網(wǎng)絡(luò)公司原創(chuàng)品牌,更為您提供山丹網(wǎng)站排名全網(wǎng)營銷落地服務(wù)。

qs的兩個(gè)方法是：1、stringify方法，用于將對(duì)象序列化成url形式的字符串，以“&”符號(hào)進(jìn)行拼接，語法“qs.stringify(data)”；2、parse方法，用于將URL形式的字符串解析成對(duì)象，語法“qs.parse(data)”。

一、qs是什么？

qs 是一個(gè)增加了一些安全性的查詢字符串解析和序列化字符串的庫。可以進(jìn)行對(duì)象與字符串之間的一個(gè)轉(zhuǎn)換。

二、qs的安裝

qs，是axios中自帶的，也是npm倉庫所管理的包。

安裝方式：

npm install qs

Vue項(xiàng)目中的導(dǎo)入方式：

import qs from 'qs'

Vue項(xiàng)目中的main.js中設(shè)置全局屬性的方式：

Vue.prototype.$qs = qs

三、qs應(yīng)用場景

使用axios，調(diào)用后端接口時(shí)使用到的。

請求方式為post，axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urllencoded'，將對(duì)象或數(shù)組的參數(shù)使用qs.stringify()進(jìn)行序列化轉(zhuǎn)化

四、qs使用

介紹它的兩個(gè)方法：stringify和parse。

qs.stringify(data)

stringify方法，是將對(duì)象序列化成url形式的字符串，以&符號(hào)進(jìn)行拼接。

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));

如上面代碼所示,輸出結(jié)果如下

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

qs.parse(data)

parse方法，是將URL形式的字符串解析成對(duì)象

示例及輸出效果如下:

import qs from 'qs'

const userStr = 'name=xiaoming&password=123456'
//qs.parse(userStr)
console.log('轉(zhuǎn)換后的格式：',qs.parse(userStr))

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

五、qs與JSON的區(qū)別

一直不太了解qs與JSON到底有什么區(qū)別？！網(wǎng)上仔細(xì)查了一下，總結(jié)如下：

qs與JSON的區(qū)別

		qs	JSON
相同點(diǎn)		都是進(jìn)行對(duì)象與字符串之間的轉(zhuǎn)換
異同點(diǎn)	stringif方法	前后端交互時(shí),將對(duì)象序列化為url形式的數(shù)據(jù)，用&拼接	數(shù)據(jù)轉(zhuǎn)化為正常的json字符串格式
		對(duì)象數(shù)據(jù)：{name:'xiaoming',password:'123123'} 轉(zhuǎn)換后數(shù)據(jù)： name=xiaoming&password=123123	對(duì)象數(shù)據(jù)：{name:'xiaoming',password:'123123'} 轉(zhuǎn)換后數(shù)據(jù)： ’{"name":"xiaoming","password":"123123"}‘
	parse方法	字符串?dāng)?shù)據(jù)： name=xiaoming&password=123123 轉(zhuǎn)換后數(shù)據(jù)： {name:'xiaoming',password:'123123'}	字符串?dāng)?shù)據(jù)： ’{"name":"xiaoming","password":"123123"}‘ 轉(zhuǎn)換后數(shù)據(jù)： {name:'xiaoming',password:'123123'}

到此，相信大家對(duì)“vue中qs的兩個(gè)方法怎么用”有了更深的了解，不妨來實(shí)際操作一番吧！這里是創(chuàng)新互聯(lián)網(wǎng)站，更多相關(guān)內(nèi)容可以進(jìn)入相關(guān)頻道進(jìn)行查詢，關(guān)注我們，繼續(xù)學(xué)習(xí)！

網(wǎng)站欄目：vue中qs的兩個(gè)方法怎么用
文章轉(zhuǎn)載：http://chinadenli.net/article8/jsehip.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供微信公眾號(hào)、建站公司、網(wǎng)站制作、營銷型網(wǎng)站建設(shè)、用戶體驗(yàn)、移動(dòng)網(wǎng)站建設(shè)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)