layui 模块化详解

最新推荐文章于 2024-09-25 00:38:01 发布

BBsatan

最新推荐文章于 2024-09-25 00:38:01 发布

阅读量3.1k

点赞数

分类专栏： layui

本文链接：https://blog.csdn.net/BBsatan/article/details/89045850

版权

本文详细探讨了layui的模块化实现，从基础概念到实际应用，解析了layui如何通过模块化提高代码组织效率和可维护性。内容涵盖模块加载、模块定义、模块间的依赖注入等方面，帮助开发者更好地理解和运用layui的模块化特性。

摘要由CSDN通过智能技术生成

layui.define(function(exports){ //提示：模块也可以依赖其它模块，如：layui.define('layer', callback);
  var obj = {
    hello: function(str){
      alert('Hello '+ (str||'mymod'));
    }
  };
  
  //输出test接口
  exports('mymod', obj);//这是输出接口 
});    

//对应着
layui.use('mymod',funciton(){
    
});

//配置和 模块可以单独写

//config的设置是全局的
layui.config({
  base: '/res/js/' //假设这是你存放拓展模块的根目录  
}).extend({ //设定模块别名
  mymod: 'mymod' //如果 mymod.js 是在根目录，也可以不用设定别名
  ,mod1: 'admin/mod1' //相对于上述 base 目录的子目录
});
翻译为
layui.config({
  base: '扩展文件路径' //  建议写绝对路径，相对路径很容易出问题
}).extend({ //设定模块别名
  模块名: '模块文件' // 模块名是使用layui.模块名  模块文件是 js名字。
                    // 不设置模块名 = 模块文件名
});
//配置文件一定要载入页面，否则无法生效


//用法：
//use 里面是模块文件 输出接口 输出名字 = exports('mymod', obj)
layui.use('mymod',funciton(){ 
    // 模块名 = mymod 他会根据这个别名找到对