全栈爬坑之路:让Ajax轻松点

以前一直在用JQuery自带的ajax功能,后来换了Vue,又开始用axios。但是每次用ajax的时候总是觉得不够轻松——Web2.0的时代,Ajax就应该像按钮、像图片,使用起来如同原生一般轻松,这样才对嘛!

<button v-api:target="{method:'get',url:'localhost/api',data:array,map:relation}"></button>

...没错,Ajax就应该像这样!一条指令,轻松搞定。

不扯虚的,直接上代码:

简书的代码编辑实在是烂 只好上图了

[注1]:见上期文章全栈爬坑之路:愉快的Vue组件通信,使用mark标签决定通信对象

[注2]:见上期文章全栈爬坑之路:愉快的Vue组件通信,实现原理1

[注3]:见上期文章全栈爬坑之路:愉快的Vue组件通信,将response.data中的属性与组件data中的属性对应起来

中间略去一段判断postman存在性的代码(其实是忘记写了)。

第二部分 具体实现

[注4]:见....好了别打我 知道错了QWQ  如果不使用数据同步功能这段可以删除

[注5]:当不使用map指定对应关系时,v-load:target="{id:'my_id'}"则直接将response.data.id同步到v-load指令所在对象data中的my_id上;否则按照上期...文章中的方式进行映射指定。


测试结果
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 175,079评论 25 709
  • 昨晚的风,轻轻的、淡淡的吹过我的皮肤,有一丝冷意轻触心头,我抬头望月,明月皎夜光,长情以怀人。 在杨柳吹...
    安之若素_一瞬之光阅读 1,781评论 0 0
  • 人们都不太习惯于去思考和做出一个逻辑性的理论研究,而更习惯于听故事,所以正常的行为逻辑本来应该是列举现象,分级分析...
    陶慈阅读 1,631评论 0 0
  • 1.学会极限销售我们会教会你怎样设定不可思议的目标,一个人没有了目标就好比大海中航行的船只,没有指南针的指引,永远...
    d027f2d8fe6c阅读 2,939评论 0 0
  • 需求弹性2 我们今天继续讲需求弹性理论的第二节。 我们先讲定义,再来解释。(大家不用着急也不要被公式和概念给吓住了...
    果大喵喵阅读 4,492评论 0 0