1. 基本使用

axios({
  url: 'https://www.baidu.com', // 僅僅作為示例，這個地址跨域請求會被攔截
  params: { // params應用於GET請求，會被拼接到地址最後，eg: https://www.baidu.com?type=nothing&page=1
    type: 'nothing',
    page: 1
  },
  method: 'GET'
}).then(result => {
  console.log(result)
});

2. axios.get(url, config)

axios.post(url, config)

axios.get('https://www.baidu.com', {
  params: {
    type: 'pop',
    page: 1
  }
}).then(res => {
  console.log(res)
});

3. 可以使用axios.defaults來配置某些常用屬性

axios.defaults.baseURL = 'xxx' // 這樣config物件中url可以簡寫
axios.defaults.timeout = 5000

4. axios.all() 若一個操作需要依賴兩個網路請求獲取的資料，則需要axios.all()方法，作用是多個請求均已完成時，執行相應操作

axios.defaults.timeout = 5000;
axios.all([
  axios({
    url: 'url1',
    params: {
      type: 'pop',
      page: 1
    }
  }),
  axios({
    url: 'url2',
    params: {
      type: 'pop',
      page: 2
    }
  })]).then(res => {
    console.log(res);
});

5. 封裝自己框架的axios

(1) 在src目錄下建立network資料夾

(2) 在network目錄下建立request.js檔案，在其中匯入axios

(3) 封裝自己的網路請求，使用 axios.create 建立多個axios例項

(4) 匯出封裝程式碼，外界匯入使用

------------- request.js-------------

import axios from 'axios'
export function instance1(config) {
  const ins1 = axios.create({
    baseURL: 'url_base',
    timeout: 5000
  });
  return ins1(config);
}

------------- main.js -------------

import {instance1} from 'network/request.js'
instance1({
  url: '/home/data',
  params: {
    type: 'pop',
    page: 1
  }
}).then(res => {
  console.log('Hello Axios');
});