您好,登錄后才能下訂單哦!
本篇內(nèi)容主要講解“vue中qs的兩個(gè)方法怎么用”,感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷,實(shí)用性強(qiáng)。下面就讓小編來帶大家學(xué)習(xí)“vue中qs的兩個(gè)方法怎么用”吧!
qs的兩個(gè)方法是:1、stringify方法,用于將對(duì)象序列化成url形式的字符串,以“&”符號(hào)進(jìn)行拼接,語法“qs.stringify(data)”;2、parse方法,用于將URL形式的字符串解析成對(duì)象,語法“qs.parse(data)”。
qs 是一個(gè)增加了一些安全性的查詢字符串解析和序列化字符串的庫??梢赃M(jìn)行對(duì)象與字符串之間的一個(gè)轉(zhuǎn)換。
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
使用axios,調(diào)用后端接口時(shí)使用到的。
請(qǐng)求方式為post,axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urllencoded',將對(duì)象或數(shù)組的參數(shù)使用qs.stringify()進(jìn)行序列化轉(zhuǎn)化
介紹它的兩個(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ū)別?!網(wǎng)上仔細(xì)查了一下,總結(jié)如下:
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í)際操作一番吧!這里是億速云網(wǎng)站,更多相關(guān)內(nèi)容可以進(jìn)入相關(guān)頻道進(jìn)行查詢,關(guān)注我們,繼續(xù)學(xué)習(xí)!
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場,如果涉及侵權(quán)請(qǐng)聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。