Layui底层方法.docx

本篇主要介绍layui.js所发挥的作用，其中过滤了大部分在外部可能不是太常用的API，侧重罗列了最常用的框架支撑。全局配置方法：layui.config(options)你可以在使用模块之前，全局化配置一些参数，尽管大部分时候它不是必须的。所以我们目前提供的全局配置项非常少，这也是为了减少一些不必要的工作，尽可能让使用变得更简单。目前支持的全局配置项如下：codelayui.codelayui.config({dir: /res/layui/ //layui.js 所在路径（注意，如果是script单独引入layui.js，无需设定该参数。），一般情况下可以无视 ,version: false //一般用于更新模块缓存，默认不开启。设为true即让浏览器不缓存。也可以设为一个固定的值，如：201610 ,debug: false //用于开启调试模式，默认false，如果设为true，则JS模块的节点会保留在页面 ,base: //设定扩展的Layui模块的所在目录，一般用于外部模块扩展});定义模块方法：layui.define([mods], callback)通过该方法可定义一个?Layui模块。参数mods是可选的，用于声明该模块所依赖的模块。callback即为模块加载完毕的回调函数，它返回一个exports参数，用于输出该模块的接口。codelayui.codelayui.define(function(exports){ //do something exports(demo, function(){alert(Hello World!); });});跟Requirejs最大不同的地方在于接口输出，exports是一个函数，它接受两个参数，第一个参数为模块名，第二个参数为模块接口，当你声明了上述的一个模块后，你就可以在外部使用了，demo就会注册到layui对象下，即可通过?layui.demo()?去执行该模块的接口。你也可以在定义一个模块的时候，声明该模块所需的依赖，如：codelayui.codelayui.define([layer, laypage], function(exports){ //do something exports(demo, function(){alert(Hello World!); });});上述的[layer, laypage]即为本模块所依赖的模块，它并非只能是一个数组，你也可以直接传一个字符型的模块名，但是这样只能依赖一个模块。加载所需模块方法：layui.use([mods], callback)Layui的内置模块并非默认就加载的，他必须在你执行该方法后才会加载。它的参数跟上述的 define方法完全一样。?另外请注意，mods里面必须是一个合法的模块名，不能包含目录。如果需要加载目录，建议采用extend建立别名（详见模块规范）codelayui.codelayui.use([laypage, layedit], function(){varlaypage = layui.laypage ,layedit = layui.layedit; //do something});该方法的函数其实返回了所加载的模块接口，所以你其实也可以不通过layui对象赋值获得接口（这一点跟Sea.js很像哈）：codelayui.codelayui.use([laypage, layedit], function(laypage, layedit){ //使用分页laypage(); //建立编辑器layedit.build();});动态加载CSS方法：layui.link(href)href即为css路径。注意：该方法并非是你使用Layui所必须的，它一般只是用于动态加载你的外部CSS文件。本地存储方法：layui.data(table, settings)参数table为表名，settings是一个对象，用于设置key、value。?该方法对localStorage进行了良好的封装，在Layui的多个内置模块（比如layim）中发挥了重要的作用，因此你可以使用它存储一些本地数据。codelayui.code//【增】：向test表插入一个nickname字段，如果该表不存在，则自动建立。layui.data(test, { key: nickname ,value: 贤心});//【删】：删除test表的nickname字段layui.data(test, { key: nickname ,remove: true});layui.data(test, null); //删除test表//【改】：同【增】，会覆盖已经存储的数据//【查】