前一天我們對HTTP有了基礎的概念，今天就要來談談要怎麼在vue中發送HTTP請求。
我們會引用axios這個函式庫。

什麼是axios

Axios 是一個基於 promise 的 HTTP 庫，應用於browser & node.js環境中，用於向後端發送請求。

axios有幾個特性:

1. 從瀏覽器中建立 XMLHttpRequests
2. 從 node.js 建立 http 請求
3. 支援 Promise API
4. 攔截請求和響應

安裝也十分簡單，透過前幾天介紹的npm便可以快速安裝進你的專案中:

npm install axios

那就來看看要怎麼使用Axios吧。

GET

params這個物件是用來傳遞query parameter，以下的網址等效於: http://請求地址?id=12345

axios
  .get("請求地址", {
    params: {
      id: 12345,
    },
  })
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });

POST

axios
  .post("請求地址", {
    firstName: "jkc",
    lastName: "123",
  })
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });

then後面為若請求成功，接下來要採取的動作，像是跳轉網頁拉等等的行為，倘若發生錯誤，會被下一行的catch捕捉，就不會進到then後面了。

Hi, I am Grant.

個人部落格 - https://grantliblog.wordpress.com/
個人網站 - https://grantli-website.netlify.app/#/mainpage
我的寫作專題 - https://vocus.cc/user/5af2e9b5fd89780001822db4#