Ajax与Axios的区别
admin
2024-01-19 17:58:46

目录

1.Ajax与Axios的区别

2.mvvm模式下更适合这种数据

3.ajax书写形式

4.axios书写形式

5.vue 中使用的 axios 代码

总结:


1.Ajax与Axios的区别

Axios:axios:是通过promise实现对ajax技术的一种封装,就像jQuery实现ajax封装一样。
简单来说就是axios实现了对ajax的封装,axios有的ajax都有,ajax有的axios不一定有。
总结:一句话就是axios是ajax,ajax不止axios。

2.mvvm模式下更适合这种数据

  • ajax(前端实现类拦截器这样的效果比较差,改动代码太多)

  • axios 前后端分离比较好用

3.ajax书写形式

$.ajax({url: '接口地址',type: 'get', //或者post   请求类型dataType: 'json',data: { // 要发送的请求参数'username' : 'admin','password' : '密码'},success : function (response) {console.log(response); // 请求返回的数据}})

4.axios书写形式

 axios({url: '接口地址',method: 'get', //或者 post    请求类型responseType: 'json', //默认格式,如果就是 json 格式可以不写data: {'username' : 'admin','password' : '密码'}}).then( function(response){ // 请求正确返回的数据console.log(response);console.log(response.data);}).catch( function(error) { // 请求错误返回的数据console.log(error);})

5.vue 中使用的 axios 代码

btn(value){let postData = qs.stringify({name: value})let api = 'http://tp.xxxxxx';axios.post(api, postData).then(function(res) { //请求成功返回的数据console.log('==00000',res.data.code);}).catch(function(err){console.log('err==>>', err); //请求失败返回的数据})}

总结:

  • ajax提供了最原生的方法,但是现在都不用它了,有种教会徒弟饿死师傅的感觉
  • axios更好的实现了异步请求
  • 起步 | Axios 中文文档 | Axios 中文网 (axios-http.cn)————推荐文档

相关内容

热门资讯

晨读 | 尤今:一缕柚香 一生... 每年中秋节前后,是怡保柚子的盛产期。柚子一上市,婆母便意兴勃勃地赶去挑选。一颗颗硕大浑圆的柚子,在家...
果然是邪修干净午餐,好吃没负担... 白米饭上的热气袅袅升腾,裹挟着牛肉的醇厚与蔬菜的清甜,那一刻,原本被琐事填满的中午忽然变得温柔而具体...
美媒:为拯救欧洲小吃,食品调香... 美国《化学化工新闻》9月2日文章,原题:为拯救欧洲零食,食品调香师尝试重现烟熏味由于健康方面的担忧,...
原创 藏... 人上年纪之后肾气慢慢亏虚,容易腰膝发软、头发花白稀疏、精神不济。日常多用家常食材食补,温和补肾固本,...
原创 4... 肾气不足容易浑身乏力、腰膝酸软、精神萎靡。这四道家常食材温和食补,固本养肾,不燥不烈,日常换着吃,帮...