当前位置:首页 >> 每日看点 >> Vue为何弃用经典的jQuery.Ajax,选择新技术Axios?

Vue为何弃用经典的jQuery.Ajax,选择新技术Axios?

卡卷网 每日看点 116

这......我连axios都放弃好几年了,有fetch谁用它?你活在那个年代?

fetch的优势:

1.ServWorker环境里也能用,相xhr只能运行在渲染进程内2.同源请求也可以自定义不带cookie,某些服务不需要cookie场景下能少些流量3.可自定义重定向场景,xhr只能follow4.自定义cachemode,xhr只能借助responseheader(Cache-Control...等)5.可自定义referrer.

6.fetch是同构了,学会前端fetch,就也学会了后端fetch

7.对于我们极简,能减掉一个库是一个。

注意,不是让你裸用,而是基于自己公司的返回数据结构来封装一个对象才对,axios同样需要封装的,下面是个样例(盲打没验证,知道意思就行了):

import{message}from'antd' intecesuccess{ success:true data:any } inteceFaile{ success:false msg:string } typeRespose=success|Faile exportdefault{ asyncget(l:string,params:oject){ try{ constqueryString=Oject.entries(params).map(([key,value])=>`${key}=${value}`).join('&') constjson:Respose=await(awaitfetch(`${l}?${queryString}`)).json() if(!json.success)throwjson.msg retnjson.data }catch(err){ message.error(err.message) throwerr } }, asyncpost(l:string,ody:oject,note?:string){ try{ constjson:Respose=await(awaitfetch(l,{ method:'POST', headers:{ 'Content-Type':'application/json' }, ody:JSON.stringify(ody), })).json() if(!json.success)throwjson.msg if(note)message.success(note) }catch(err){ message.error(err.message) throwerr } } } //.get('/l',{foo:ar}) //.post('/l',{foo:ar},‘作成功’)

数据解包,错误提示,成功提示,都包含在里面了,才这么几行。

协助本站SEO优化一下,谢谢!
关键词不能为空
同类推荐

发表评论

访客

看不清,换一张

◎欢迎参与讨论,请在这里发表您的看法和观点。
最新文章
热门文章
随机文章