最近乙個練手vue專案,選擇axios作為網路請求庫。
後台一介面使用了陣列作為引數。本以為沒什麼,實則遇到了乙個大坑。
axios.post(url,).then((res) => )
如果你像正常的方式一樣,將乙個陣列作為乙個請求引數傳遞,那麼要麼axios直接丟擲連線異常,要麼後端介面接收不到匹配的引數。
import axios from 'axios'
import qs from 'qs'
get / delete請求方式解決方式如下
axios.get(url, ,
paramsserializer: params => )
}})axios.delete(url, ,
paramsserializer: params => )
}})
post / put 請求方式解決方式如下
axios.post(url, qs.stringify(
params: , ))
axios.put(url, qs.stringify(params: , ))
其餘類似。這樣一來,陣列引數就會轉換為如下的形式
url?ids=1&ids=2&id=3
後台介面接收
(1)陣列型別(int)接收結果
[1,2,3]
(1)字串形式(string)接收結果
1,2,3
大功告成!
當然,這只是一種形式,大概有4種形式:
qs.stringify(, )
//形式: ids=1&ids=2&id=3
qs.stringify(, )
//形式: ids[0]=1&aids1]=2&ids[2]=3
qs.stringify(, )
//形式:ids=1&ids=2&ids=3
qs.stringify(, )
//形式: ids=1&ids=2&id=3
最後,對axios進行了乙個封裝,方便自己使用:
* 請求結果處理
* @param axiosrequest
* @param successcallback
* @param errorcallback
*/function thenresponse (axiosrequest, successcallback, errorcallback) else
}}).catch((error) => )
}export使用:
//匯入封裝axios的js檔案
import from 'utils/api'
//傳送delete請求,帶陣列引數 與 普通引數
deleterequest('/admin/user/del', , function (res) , function (errcode, errmsg) )
//傳送get請求
getrequest('/admin/users', , function (res) , function (errcode, errmsg) )
axios 傳遞陣列引數
正常傳參 request是封裝axios的請求方法,這部分以後貼具體的封裝 import request from utils request export function fetchlist query 陣列傳參 資料定義為陣列,傳遞的引數希望的格式是 http ip contract?stat...
vue結合axios傳遞引數
首先要安裝好axios import axios from axios 匯入axios export default args testinte ce args 把form表單轉json格式 function fromjson json vue中方法 methods else testfun2 cf...
頁面傳遞陣列引數
1 將陣列轉化成字串,用特殊字元如 將陣列的元素隔開,用普通的字串引數傳遞 2 使用json方式傳遞引數 解析c 後台得到的是個string objstr內容 從js陣列中解析出json物件返回該物件的字串表示 private static string getjsonstr string arra...