## 擴展一個 layui 模塊 layui 官方提供的模塊有時可能還無法滿足你，或者你試圖按照layer的模塊規范來擴展一個模塊。那么你有必要認識layui.define()方法，相信你在文檔左側的“底層方法”中已有所閱讀。下面就就讓我們一起擴展一個Layui模塊吧： 第一步：確認模塊名，假設為：mymod，然后新建一個mymod.js 文件放入項目任意目錄下（注意：不用放入layui目錄） 第二步：編寫test.js 如下： ~~~ /** 擴展一個test模塊 **/ layui.define(function(exports){ //提示：模塊也可以依賴其它模塊，如：layui.define('layer', callback); var obj = { hello: function(str){ alert('Hello '+ (str||'mymod')); } }; //輸出test接口 exports('mymod', obj); }); ~~~ 第三步：設定擴展模塊所在的目錄，然后就可以在別的JS文件中使用了 ~~~ //config的設置是全局的 layui.config({ base: '/res/js/' //假設這是你存放拓展模塊的根目錄 }).extend({ //設定模塊別名 mymod: 'mymod' //如果 mymod.js 是在根目錄，也可以不用設定別名 ,mod1: 'admin/mod1' //相對于上述 base 目錄的子目錄 }); //你也可以忽略 base 設定的根目錄，直接在 extend 指定路徑（主要：該功能為 layui 2.2.0 新增） layui.extend({ mod2: '{/}http://cdn.xxx.com/lib/mod2' // {/}的意思即代表采用自有路徑，即不跟隨 base 路徑 }) //使用拓展模塊 layui.use(['mymod', 'mod1'], function(){ var mymod = layui.mymod ,mod1 = layui.mod1 ,mod2 = layui.mod2; mymod.hello('World!'); //彈出 Hello World! }); ~~~ 大體上來說，layui 的模塊定義很類似 Require.js 和 Sea.js，但跟他們又有著明顯的不同，譬如在接口輸出等地方。 結語 其實關于模塊的核心，就是 layui.js 的兩個底層方法：一個用于定義模塊的 layui.define()，一個加載模塊的 layui.use()。