Vue学习与整理（三）：axios请求

目录

1.通过axios发起GET

2.通过axios发起POST请求

3.执行多个并发请求

---

Axios 是一个基于 Promise 的 HTTP 库，可以用在浏览器和 node.js 中

 

1.通过axios发起GET

// 直接在 URL 上添加参数 ID=12345
axios.get('/user?ID=12345')
  .then(function (response) {
    console.log(response.data);
    console.log(response.status);
    console.log(response.statusText);
    console.log(response.headers);
    console.log(response.config);
  })
  .catch(function (error) {
    console.log(error);
  });
 
// 也可以通过 params 设置参数：
axios.get('/user', {
    params: {
      ID: 12345
    }
  })
  .then(function (response) {
    console.log(response.data);
    console.log(response.status);
    console.log(response.statusText);
    console.log(response.headers);
    console.log(response.config);
  })
  .catch(function (error) {
    console.log(error);
  });

2.通过axios发起POST请求

new Vue({
  el: '#app',
  data: {},
  mounted () {
      axios.post('/login', {
              userName: 'Fred',    
              password: 'Flintstone'
            })
           .then(function (response) {
                console.log(response.data);
                console.log(response.status);
                console.log(response.statusText);
                console.log(response.headers);
                console.log(response.config);
            })
           .catch(function (error) {
                console.log(error);
            });
  }
})

3.执行多个并发请求

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) {
    // 两个请求现在都执行完成
  }));