码迷,mamicode.com
首页 > Web开发 > 详细

alone.js

时间:2015-09-01 12:36:14      阅读:227      评论:0      收藏:0      [点我收藏+]

标签:

alone.js

 

github地址:https://github.com/oncoy/alone

有问题请邮箱联系:oncoy5@163.com

简要和说明

针对AJAX请求做个整理。让AJAX变得模块化。统一管理。调用。方便测试。简称:AJAX模块化分割器(工具),就问还有谁~还有谁~

回调执行顺序:前端req -> trade模版req -> 发送请求并执行 loading -> trade模版res -> 前端res

为了解决什么问题而存在:

1.前后端交互协调是大坑。前后端协调传递的json数据的时候,如果前后端没有任何一方先提供好接口,都0基础同时开发。那么问题来了。你就会遇到数据格式过不统一。那么你的trade模版可由后端自己维护。我们前端就不用管他到底返回什么接口了。我们只把接口测试文档写在里面了。到后期合并接口的时候。让后端或则前端自己进行修改就行了。就不用去改变页面业务代码的数据结构了。

2.请求接口模块化。接口文档按照不同的模块分离出来。你需要那个模块的接口。配置那个接口路径。就可以调用了。方便统一管理和修改

下面省略一千条问题解答~

更多方式请参照demo

用法 - 四分五十九秒 上手

前端页面调用

 /*配置路径*/
    alone.config({
        //最开始的路径都是以alone.js文件存放路径为基准的相对路径操作。" ../ "  返回上一级
        //这是配置和绑定请求的路径 - 比如:ajaxAdmin.js
        control: {
            ‘model‘: ‘../ajaxModel/model.js‘  // —— 当前路径都是以alone.js存放路径为基准的
            , ‘model2‘: ‘../ajaxModel/model2.js‘
        }
    });

    //---------------------------------  调用 ---------------------------------
    /*
     * 调用方式一 : 走路由控制
     */

    //这里我们测试。所以我们只调用开启的测试模式的接口
    alone.on(‘model/getAlone1‘, { ‘name1‘: ‘a‘, ‘age‘: 17 }, function (data, res) {
        //回调函数执行
        console.log(data);//最后生成的对象数据
        console.log(res);//最后生成的对象数据
        console.log(this);//当前域
    }, this);

    /*
     * 调用方式二 : 直接访问路径。不走路由控制
     */
    alone.on({
        url: ‘https://www.baidu.com/‘,
        type: ‘post‘
    }, ‘name1=a&age=17‘, function (data, res) {
        //回调函数执行
        console.log(data);//最后生成的对象数据
        console.log(res);//最后生成的对象数据
        console.log(this);//当前域
    }, this, ‘jsonp‘);

 

trade模块写法

 /*
    * 缺参模型:———— 常用模式
    *
    * 1、请求别名
    * 2、响应回调参数。 - res为响应对象
    * 3、请求路径。 - 请求路径
    * 4、请求类型。- 默认 GET
    * 5、测试用。 - 值为‘true‘ 。不做真正的提交。直接进入返回回调
    */
    trade(‘getAlone1‘, function (res) {
        //-- res:响应对象

        /*
            设置并且执行回调
                - req.data   :   返回参数
        */
        res.setData({ name: ‘admin‘, age: 16 });//测试的时候自己设置返回数据。然后后端自己根据这里的模版。修改返回值
    }, ‘a.html‘, ‘post‘, true);

 

alone.js

标签:

原文地址:http://www.cnblogs.com/oncoy/p/4775267.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!