axios常見傳參方式get/post/put/patch/delete

axios的全局配置參考:

axios.defaults.timeout = 15000;  //超時響應
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded'; // 配置請求頭(推薦)
// axios.defaults.headers.post['Content-Type'] = 'application/json;charset=utf-8'; // 配置請求頭
axios.defaults.baseURL = $core.use('http'); //確認協議和地址
axios.defaults.withCredentials = true;   // axios 默認不發送cookie,需要全局設置true發送cookie

get強求

一般的get請求,不推薦

axios.get('/user?id=12345&name=user')

推薦

axios.get('/user', {  //params參數必寫 , 如果沒有參數傳{}也可以
    params: {  
       name:""
    }
})

put/post/patch請求

(1) 傳參格式爲 formData 

request的Header:'Content-Type'= 'multipart/form-data'

var formData=new FormData();
formData.append('user',123456);
formData.append('pass',12345678);
 
axios.post("/notice",formData)
     .then((res) => {return res})
     .catch((err) => {return err})
 

(2) 傳參格式爲 query 形式  

request的Header:'Content-Type'= 'application/x-www-form-urlencoded'

第一種情況:使用$qs.stringify

import Qs from 'qs'   //引入方式
Vue.prototype.$qs = Qs  //全局加載
this.$qs.stringify(data);  //使用方式
this.$qs.parse(data);  //使用方式
 
var readyData=this.$qs.stringify({
    id:1234,
    name:user
});
axios.post("/notice",readyData)
     .then((res) => {return res})
     .catch((err) => {return err})

第二種情況:使用URLSearchParams

在瀏覽器中,您可以使用URLSearchParams API,如下所示:

var params = new URLSearchParams();
params.append('param1', 'value1');
params.append('param2', 'value2');
axios.post('/foo', params);

請注意,並不是所有瀏覽器都不支持URLSearchParams,但是有一個polyfill可用(確保polyfill全局環境)。

(3) 傳參格式爲 raw (JSON格式) 

  第一種情況: axios將JavaScript對象序列化爲JSON

request的Header:'Content-Type'= 'application/json;charset=UTF-8'

var readyData={
    id:1234,
    name:user
};
axios.post("/notice",readyData)
     .then((res) => {return res})
     .catch((err) => {return err})

 第二種情況:

request的Header:‘Content-Type'= 'application/json;charset=UTF-8'

var readyData=JSON.stringify({
    id:1234,
    name:user
});
axios.post("/notice",readyData)
     .then((res) => {return res})
     .catch((err) => {return err})

 

發佈了235 篇原創文章 · 獲贊 55 · 訪問量 19萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章