axios的詳細講解

axios 是乙個基於promise 用於瀏覽器和 nodejs 的 http 客戶端，簡單的理解就是ajax的封裝。

特性：1、利用npm安裝（例如vue腳手架專案中使用）

npm install axios

2、利用cdn（常用）

src=
"">
script
>

1、get請求

//get請求方式一：
axios(,
// 設定請求頭資訊
headers:
responsetype:
'json'})
.then
((response)
=>).
catch
((error)
=>
);

//get請求方式二：
axios.
get(
"api",,
// 設定請求頭資訊，可以傳遞空值
headers:})
.then
((response)
=>).
catch
(error =>
);

2、post請求

//post請求方式一：
// 注：post請求方法有的要求引數格式為formdata格式，此時需要借助 qs.stringify()方法將物件轉換為字串
let obj = qs.
stringify()
;axios(,
responsetype:
'json'})
.then
((response )
=>).
catch
(error =>
);

//post請求方式二：
let data =
,headers =
;// 若無headers資訊時，可傳空物件占用引數位置
axios.
post
("api"
, qs.
stringify
(data),}
).then
((response)
=>).
catch
((error)
=>
);

注意：

post請求的時候引數通過data進行傳遞

get請求的時候引數通過params進行傳遞

主要用到兩個函式：

axios.all()

axios.spread()

//方法一：請求成功時響應的是乙個陣列

/script>

//方法二：採用axios提供的spread函式處理響應陣列結果

/script>

首先通過axios.defaults.baseurl抽離出公共的部分，在各部分請求位址時可以省去公共的部分，適用於專案中所有的axios請求。

//baseurl的舉例，還可以配置headers等

/script>

專案中網路請求可能不止乙個，可以通過建立多個axios例項進行不同的配置。


//建立乙個axios的例項
let instance=axios.
create()
//例項的使用
instance()
.then
(res=>
)<
/script>

axios提供了兩種***：

1、請求***（成功，失敗）

2、響應***（成功，失敗）

***的作用：

1、在網路請求時發起請求

2、請求響應時對操作進行相應的處理

***的使用案例：

1、請求***成功時，可以新增網頁載入的動畫等

2、響應***成功時，可以進行資料的相應處理

//定義了兩個請求***，兩個響應***，為了看執行流程
"">
<
/script>
//axios的請求***，在axios進行網路請求之前觸發
axios.interceptors.request.
use(
config =>
,           error =>
)       axios.interceptors.request.
use(
config =>
,           error =>
)//axios的響應***，在axios響應資料之前觸發
axios.interceptors.response.
use(
response =>
,           error =>
)       axios.interceptors.response.
use(
response =>
,           error =>
)//axios傳送get請求
/script>

***執行結果：請求***方向成功2 請求***方向成功1 響應***方向成功1 響應***方向成功2

object

根據結果，我們看到請求***後定義先執行，響應***先定義先執行。

axios詳細封裝

我們採取封裝分類管理舉個栗子新建資料夾utils 裡面新建url.js 全站http的配置全站http配置 axios引數說明 isserialize是否開啟form表單提交 istoken是否需要token 新增乙個響應 axios interceptors response use func...

UITableView的詳細講解

1.uitableview的初始化 csharp view plain copy uitableview tableview uitableview alloc initwithframe cgrectmake 0,0,320,420 tableview setdelegate self table...

git checkout b 的詳細講解

建立分支 git branch mybranch 切換分支 git checkout mybranch 建立並切換分支 git checkout b mybranch 更新master主線上的東西到該分支上 git rebase master 切換到master分支 git checkout mas...

axios的詳細講解

axios詳細封裝

UITableView的詳細講解

git checkout b 的詳細講解

相關推薦