获取数据的方式JQ,fetch,ajax,axios比较

2018-11-16  本文已影响0人  芥末的糖

1 JQuery ajax

$.ajax({
   type: 'POST',
   url: url,
   data: data,
   dataType: dataType,
   success: function () {},
   error: function () {}
});

1.这东西很少用了,但是对于原生的XHR的复杂封装来讲,还是蛮好用的
2.不符合现在的MVVM框架的思想,要用就得引入JQ

2. Fetch

try {
  let response = await fetch(url);
  let data = response.json();
  console.log(data);
} catch(e) {
  console.log("Oops, error", e);
}

1.fetch是一个promise 的封装,不支持低版本
2.fetch没有办法原生监测请求的进度

3.axios

axios({
    method: 'get',
    url: '/user',
    data: {
    }
})
.then(function (response) {
    console.log(response);
})
.catch(function (error) {
    console.log(error);
});

Vue2.0之后,尤雨溪推荐大家用axios替换JQuery ajax,

1.从 node.js 创建 http 请求
2.支持 Promise API
3.客户端支持防止CSRF
4.提供了一些并发请求的接口(重要,方便了很多的操作)

vue全家桶里的Vue-resource

The plugin for Vue.js provides services for making web requests and handle responses using a XMLHttpRequest or JSONP.

Vue-resource

{
  // GET /someUrl
  this.$http.get('/someUrl').then(response => {
 
    // get body data
    this.someData = response.body;
 
  }, response => {
    // error callback
  });
}
上一篇 下一篇

猜你喜欢

热点阅读