📂Js
2024-05-09 09:34阅读: 218评论: 0推荐: 0

layui 的模块定义和加载方法 (layui.define 和 layui.use)

这是一个简易版的 layui 模块定义和加载模块封装

layui github: https://github.com/layui/layui

(function () {
"use strict";
// 定义 layui 类
var Layui = function () {
this.v = "1.0.9";
};
// 定义模块
Layui.prototype.define = function (deps, factory) {
// 将模块加载到全局变量 layui 中
var setApp = function (app, exports) {
window.layui[app] = exports;
};
if (typeof deps === "function") {
factory = deps;
deps = [];
}
factory(setApp);
return this;
};
// 加载模块
Layui.prototype.use = function (apps, callback, exports) {
if (typeof apps === "string") {
apps = [apps];
}
// 导出的模块
exports = exports || [];
// 获取第一个需要加载的模块
var item = apps[0];
// 加载模块方法
function onCallback() {
exports.push(window.layui[item]);
callback.apply(window.layui, exports);
}
// 如果要加载的模块大于1个,则递归调用 use 方法来继续加载后续模块
if (apps.length > 1) {
this.use(apps.slice(1), callback, exports);
} else {
// 调用加载模块的方法
onCallback();
}
};
// 导出 layui 类到全局变量
window.layui = new Layui();
})();
// 后续就可以直接使用 layui.define 和 layui.use 了
// 定义一个 jquery 模块
layui.define("jquery", function (exports) {
// 这里可以写一些 jquery 插件的定义
var obj = {
test: function (msg) {
console.log(msg);
},
};
// 导出 jquery 对象
exports("jquery", obj);
});
layui.use("jquery", function ($) {
// 这里就可以直接使用自己定义的 jquery 里的 test 方法了
$.test("<h1>Hello, layui!</h1>");
});
posted @   灵火  阅读(218)  评论(0编辑  收藏  举报
点击右上角即可分享
微信分享提示
评论
收藏
关注
推荐
深色
回顶
收起