Apakah dua kaedah qs dalam vue

Dua kaedah qs ialah: 1. Kaedah stringify digunakan untuk menyerikan objek menjadi rentetan dalam bentuk URL, menyambungkannya dengan simbol "&", dan sintaksnya ialah "qs. stringify(data)"; 2. Kaedah parse digunakan untuk menghuraikan rentetan dalam bentuk URL ke dalam objek. Sintaks ialah "qs.parse(data)".

Persekitaran pengendalian tutorial ini: sistem windows7, versi vue3, komputer DELL G3.

1. Apakah itu qs?

qs ialah perpustakaan untuk penghuraian rentetan pertanyaan dan siri rentetan yang menambahkan beberapa keselamatan. Penukaran antara objek dan rentetan boleh dilakukan.

2. Pemasangan qs

qs disertakan dalam axios dan juga merupakan pakej yang diuruskan oleh gudang npm.

Kaedah pemasangan:

npm install qs

Kaedah import dalam projek Vue:

import qs from 'qs'

Vue The cara untuk menetapkan sifat global dalam main.js dalam projek:

Vue.prototype.$qs = qs

3 senario aplikasi QS

Apabila menggunakan axios, apabila memanggil hujung belakang. antara muka yang digunakan.

Kaedah permintaan ialah pos, axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urllencoded', gunakan qs.stringify() untuk parameter objek atau tatasusunan Lakukan penukaran bersiri

4. Gunakan qs

untuk memperkenalkan dua kaedahnya: stringify dan parse.

qs.stringify(data)

Kaedah stringify ialah mensirikan objek menjadi rentetan dalam bentuk url, dengan & Simbol disambung.

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

Seperti yang ditunjukkan dalam kod di atas, hasil output adalah seperti berikut

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

qs.parse(data)

kaedah menghuraikan ialah menghuraikan rentetan dalam bentuk URL ke dalam objek

Contoh dan kesan output adalah seperti berikut:

import qs from 'qs'

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

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

5. Perbezaan antara qs dan JSON

Saya tidak pernah faham perbezaan antara qs dan JSON? ! Saya menyemak dengan teliti dalam talian dan ringkasannya adalah seperti berikut:

qsData rentetan: '{"name":"xiaoming","password":"123123"}'Data ditukar: {name:'xiaoming',kata laluan:'123123'}

JSON

Mata yang sama

semuanya antara objek dan rentetan Penukaran

Persamaan dan perbezaan

kaedah stringif

Semasa interaksi hadapan dan belakang, objek disiri ke dalam data dalam bentuk URL dan disambung dengan gaya &

Data ditukar kepada format rentetan json biasa

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'}

Data objek : {name:'xiaoming ',password:'123123'}Data ditukar: name=xiaoming&password=123123

Data objek: {name:'xiaoming',password:'123123'}Data ditukar: '{"name":"xiaoming","password": "123123"} '

kaedah parse

Data rentetan: name=xiaoming&password=123123Data ditukar: {name:'xiaoming',password:'123123'}

[Cadangan berkaitan: video vuejs Tutorial, pembangunan bahagian hadapan web]

Atas ialah kandungan terperinci Apakah dua kaedah qs dalam vue. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!