• Seajs教程


    API 快速参考

    该页面列举了 Sea.js 的常用 API。只要掌握这些用法,就可以娴熟地进行模块化开发。

     

    seajs.config

    用来对 Sea.js 进行配置。

    seajs.config({

     

      // 设置路径,方便跨目录调用

      paths: {

        'arale': 'https://a.alipayobjects.com/arale',

        'jquery': 'https://a.alipayobjects.com/jquery'

      },

     

      // 设置别名,方便调用

      alias: {

        'class': 'arale/class/1.0.0/class',

        'jquery': 'jquery/jquery/1.10.1/jquery'

      }

     

    });

    seajs.use

    用来在页面中加载一个或多个模块。

    // 加载一个模块

    seajs.use('./a');

     

    // 加载一个模块,在加载完成时,执行回调

    seajs.use('./a', function(a) {

      a.doSomething();

    });

     

    // 加载多个模块,在加载完成时,执行回调

    seajs.use(['./a', './b'], function(a, b) {

      a.doSomething();

      b.doSomething();

    });

     

    define

    用来定义模块。Sea.js 推崇一个模块一个文件,遵循统一的写法:

    define(function(require, exports, module) {

     

      // 模块代码

     

    });

     

    require, exports 和 module 三个参数可酌情省略,具体用法如下。

    require

    require 用来获取指定模块的接口。

    define(function(require) {

     

      // 获取模块 的接口

      var a = require('./a');

     

      // 调用模块 的方法

      a.doSomething();

    });

     

    require.async

    用来在模块内部异步加载一个或多个模块。

    define(function(require) {

     

      // 异步加载一个模块,在加载完成时,执行回调

      require.async('./b', function(b) {

        b.doSomething();

      });

     

      // 异步加载多个模块,在加载完成时,执行回调

      require.async(['./c', './d'], function(c, d) {

        c.doSomething();

        d.doSomething();

      });

     

    });

     

    exports

    用来在模块内部对外提供接口。

    define(function(require, exports) {

     

      // 对外提供 foo 属性

      exports.foo = 'bar';

     

      // 对外提供 doSomething 方法

      exports.doSomething = function() {};

     

    });

     

    module.exports

    与 exports 类似,用来在模块内部对外提供接口。

    define(function(require, exports, module) {

     

      // 对外提供接口

      module.exports = {

        name: 'a',

        doSomething: function() {};

      };

     

    });

    SeaJS使用说明

     

    在页面中加载模块

    在 hello.html 页尾,通过 script 引入 sea.js 后,有一段配置代码: 

    // seajs 的简单配置

    seajs.config({

      base: "../sea-modules/",

      alias: {

        "jquery": "jquery/jquery/1.10.1/jquery.js"

      }

    })

     

    // 加载入口模块

    seajs.use("../static/hello/src/main")

    sea.js 在下载完成后,会自动加载入口模块。页面中的代码就这么简单。 

    模块代码

    这个小游戏有两个模块 spinning.js 和 main.js,遵循统一的写法: 

    // 所有模块都通过 define 来定义

    define(function(require, exports, module) {

     

      // 通过 require 引入依赖

      var $ = require('jquery');

      var Spinning = require('./spinning');

     

      // 通过 exports 对外提供接口

      exports.doSomething = ...

     

      // 或者通过 module.exports 提供整个接口

      module.exports = ...

     

    });

     

  • 相关阅读:
    jQuery的简单应用
    JQuery事件
    [django]数据导出excel升级强化版(很强大!)
    [Django]用户权限学习系列之权限管理界面实现
    [Django]用户权限学习系列之设计自有权限管理系统设计思路
    [jquery]显示隐藏div标签的几种方法
    [Django]用户权限学习系列之User权限基本操作指令
    [jquery]jquery正则表达式验证(手机号、身份证号、中文名称)
    [Django]用户权限学习系列之Permission权限基本操作指令
    [python]set集合学习
  • 原文地址:https://www.cnblogs.com/zhangligopher/p/3998442.html
Copyright © 2020-2023  润新知