用XHR簡單封裝乙個axios

2022-09-06 06:00:11 字數 2185 閱讀 2549

>get請求

button

>

<

button

onclick

="testpost()"

>post請求

button

>

<

button

onclick

="testput()"

>put請求

button

>

<

button

onclick

="testdelete()"

>delete請求

button

>

div>

<

script

>

function

testget()

}).then(

response

=>

, error

=>);}

function

testpost()

}).then(

response

=>

, error

=>);}

//axios 簡單封裝

function

axios(, data

={} })

*/let querystring =""

; object.keys(params).foreach(key

=>=$

&`;});

//判斷querystring有沒有值

if(querystring)

console.log(querystring);

//1.執行非同步ajax請求

//建立xhr物件

//開啟鏈結(初始化請求,沒有請求)

request.open(method, url,

true

);

//傳送請求

if(method

==="

get"

) else

if(method

==="

post")

//繫結狀態改變的監聽

request.onreadystatechange

=function

()

//如果響應狀態碼在[200,300)之間表示請求成功,否則失敗

const

=request;

if(status

>=

200&&

status

<

300) ;

如果請求成功了,呼叫resolve()

resolve(response);

} else

};});

}script

>

body

>

html

>

封裝乙個axios 利用xhr和promise

基本思路 一 建立乙個promise物件,成功的結果為response,異常的結果為error 二 利用xhr建立乙個ajax請求 2.1建立xhr物件 2.2開啟連線 初始化請求 2.3 根據請求方式來決定要不要傳請求體引數 2.4監視狀態,如果請求成功呼叫reject 失敗resolve 獲取狀...

用axios封裝乙個jq版的ajax

封裝axios,減少學習成本,引數基本跟jq ajax一致 param type 請求的型別,預設post param url 請求位址 param time 超時時間 param data 請求引數 param datatype 預期伺服器返回的資料型別,xml html json param h...

用PACKAGE封裝資料的乙個簡單演示

資料封裝有幾個好處 1.可讀性提高了 2.資料結構發生變化時,更新工作可以最小化且集中化處理 3.隱藏了底層資料結構,對商業保密起到一定作用。下面以乙個案例演示一下資料封裝的過程 在common使用者下,我有乙個t log表用來記錄程式執行日誌,其結構如下 為了將寫日誌的介面開放給其他使用者,我建立...