Vue元件化時使用axios處理ajax請求的使用

推薦方式

首先在 main.js 中引入 axios

// 引入 axios
import axios from `axios`

這時候如果你想在其它的元件中使用axios進行ajax請求是或提示報錯的，報錯內容大致是axios is undefined。
我們通常的決絕方案是將axios改寫為 Vue 的原型屬性,如下

將axios寫入Vue的原型鏈作為Vue的屬性

// 設定axios請求的預設host
axios.defaults.baseURL = "https://www.ifilm.ltd/api/"
// 將axios繫結給vue成為一個屬性
Vue.prototype.$http = axios

在其他元件中使用axios

this.$http.get(`路由`).then(response => {
        // todo something
      })

此方式可以類比到Vue的其他庫使用

兩種不推薦的使用示範

將axios全域性化，作為全域性變數

// 引入axios
import axios from `axios`
// 將axios全域性化
window.axios = axios;

另外一個不太優雅的方式就是在需要的每個元件中都引入對應的庫