axios

Chun
2 min readJul 28, 2020

簡化 AJAX 撈取資料步驟的 js 套件

寫法

get 方法

var data;    // 宣告空 data 用來裝回傳的資料axios.get("https:xxx.com")
.then(function (response) { // 回傳的所有資料會代入參數 response 裡
data = response.data; // response 參數可自己命名
});

post 方法

axios.post('api 網址', 要傳送的資料)
.then(function (res) {
})
// 失敗
.catch((error) => { // 代參數 error
console.log(error);
})

非同步

以下 console 的順序結果會是:A → C → B。因為非同步的關係,程式碼在運行時,不會等資料全部回傳完成,就先繼續執行下面的程式,所以等到資料回傳完畢後,最後的 console.log(‘B’) 才會秀出來。

var data;    // 宣告空 data 用來裝回傳的資料console.log('A');axios.get("https:xxx.com")
.then(function (response) { // 回傳的所有資料會代入參數 response 裡
data = response.data; // response 參數可自己命名
console.log('B');});
console.log('C');

AJAX 工具

  • JSON VIEW(將 API 資料轉成易於閱讀的 JSON 格式)
  • test cors(檢查 API 是否撈取資料)

API

參考資料

axios直播共筆文件axios 基本使用

--

--