Vue 之 Axios 异步请求

Axios 文档地址:https://www.kancloud.cn/yunye/axios/234845

1.安装 Axios 

   npm install axios

2.执行get请求

 // 为给定 ID 的 user 创建请求
  axios.get('/user?ID=12345')
    .then(function (response) {
     console.log(response);
   })
   .catch(function (error) {
    console.log(error);
   });

// 可选地，上面的请求可以这样做
axios.get('/user', {
    params: {
      ID: 12345
    }
  })
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });

3.执行post请求

axios.post('/user', {
    firstName: 'Fred',
    lastName: 'Flintstone'
  })
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });

//执行多个并发请求

function getUserAccount() {
  return axios.get('/user/12345');
}

function getUserPermissions() {
  return axios.get('/user/12345/permissions');
}

axios.all([getUserAccount(), getUserPermissions()])
  .then(axios.spread(function (acct, perms) {
    // 两个请求现在都执行完成
  }));

axios API

可以通过向 axios 传递相关配置来创建请求

axios(config)

// 发送 POST 请求
axios({
  method: 'post',
  url: '/user/12345',
  data: {
    firstName: 'Fred',
    lastName: 'Flintstone'
  }
});

4.axios 实例

// 在同一个页面
import axios from 'axios'

axios.get('https://www.apiopen.top/journalismApi')
  .then(function (response) {
    console.log(response)
  })
  .catch(function (error) {
    console.log(error)
  })