粗略學習axios筆記

2021-10-24 12:29:37 字數 4587 閱讀 2806

是乙個類庫,基於promise管理的ajax庫

支援的引數配置:

axios.get(url,options)
options:配置專案

get請求中會把params鍵值對拼接成urlencoded格式的字串,然後以問好傳遞引數的方式傳遞給伺服器,類似於jquery的ajax中的data,或者自己在url後面拼接也行

axios.post(url,options)
options:配置專案

配置專案中傳遞的內容都相當於基於請求主體傳遞給伺服器,但是傳遞給伺服器的內容格式是json字串格式

lang

="en"

>

>

charset

="utf-8"

>

name

="viewport"

content

="width=device-width, initial-scale=1.0"

>

>

axios測試title

>

head

>

>

body

>

src=

"./node_modules/axios/dist/axios.js"

>

script

>

>

//是乙個類庫,基於promise管理的ajax庫

請求中會把params鍵值對拼接成urlencoded格式的字串,然後以問好傳遞引數的方式傳遞給伺服器,類似於jquery的ajax中的data

// axios.get('./servertest.js',

// });

//2.此步post結果出現405,是因為絕大多數web伺服器,都不允許靜態檔案響應post請求

//配置專案中傳遞的內容都相當於基於請求主體傳遞給伺服器,但是傳遞給伺服器的內容格式是json字串格式

// axios.post('./servertest.js',

// });

//3.基於get或post方法傳送請求,返回的結果都是promise例項

// let promise = axios.get('./servertest.js');

// promise.then(result => ).catch(msg => )

// let promise = axios.post('./servertest.js', );

// promise.then(result => ).catch(msg => ) //此步post結果出現405,是因為絕大多數web伺服器,都不允許靜態檔案響應post請求

let promise = axios.

head

('./servertest.js');

promise.

then

(result =>).

catch

(msg =>

)script

>

html

>

all()方法可當兩(多)個請求都完成的時候會觸發這個函式,兩個引數分別代表返回的結果

lang

="en"

>

>

charset

="utf-8"

>

name

="viewport"

content

="width=device-width, initial-scale=1.0"

>

>

axios練習2title

>

head

>

>

body

>

src=

"./node_modules/axios/dist/axios.js"

>

script

>

>

//1.簡單形式:

// let result = null;//存在全域性變數之後就都可以得到a的結果和b的結果

// axios.get('a').then(resulta => ).then(resultb => )

方法//sendary存放兩個ajax請求的promise例項

let sendary =

[ axios.

get(

'package.json'

), axios.

get(

'servertest.js')]

;//兩個請求都完成在做一些操作

axios.

all(sendary)

.then

(result =>);

script

>

html

>

lang

="en"

>

>

charset

="utf-8"

>

name

="viewport"

content

="width=device-width, initial-scale=1.0"

>

>

axios的一些apititle

>

head

>

>

body

>

src=

"./node_modules/axios/dist/axios.js"

>

script

>

>

可以通過配置檔案來傳送請求

axios(}

) 預設的get方式

axios

('servertext.js'

)script

>

html

>

axios.

request

(config)

;axios.

get(url[

,config]);

axios.

delete

(url[

,config]);

axios.

head

(url[

,config]);

axios.

post

(url[

,data[

,config]])

;axios.

put(url[

,data[

,config]])

axios.

patch

(url[

,data[

,config]

])

//初始化一些常用的配置項

axios.defaults.baseurl =

'../servertest.js'

;//初始化之後使用

axios.

get(

'/list').

then

(result =>

)//此時訪問的是 servertest.js中的/list,這裡請求的是靜態頁面所以理解意思就可以了

//即初始化配置了url,那麼之後就是在這個基礎上繼續接著往下寫

<

/script>

axios.

post

(url,

[,data]

[,config]

)

axios.

post

('/add',,

}).then

(result =>

)//post三個引數 乙個url,乙個data,乙個配置屬性

axios.defaults.

validatestatus

=function

vakudatestatus

(status)$/.

test

(status)

//此方法相當於把預設的狀態碼規則改了

//即自定義成功失敗規則

};

//修改請求頭

axios.defaults.headers.post[

'content-type']=

;//設定在post請求中基於請求主體向伺服器傳送內容的格式,預設是raw,專案中常用的是url-endoded格式

//設定響應***

axios.interceptors.response.

use(

function

success

(result)

,function

error()

);//分別在響應成功和響應失敗的時候做一些攔截處理(在執行成功後設定的方法之前,先會執行***中的方法)

axios學習筆記

二.axios的post方式請求介面 三.axios的併發 四.axios的自定義例項 五.axios 使用axios前要引入axios檔案 1 axios.get url 獲取資料 then res console.log res 顯示資料 then err promise.reject err ...

axios學習筆記

預設是get請求,params是為get請求傳參時使用 axios then res axios.all axios.all axios axios then result result 為第乙個請求返回的資料和第二個請求返回資料的陣列集合 axios.all axios axios then ax...

axios學習筆記

它是乙個功能強大的網路請求庫 script src script axios.get 位址?key value key2 values then function response function err axios.get 位址?查詢字串 then function response funct...