layui文档通读笔记

预先加载模块layui.use

layui通过use方法加载模块，当你的js需要用到layui模块的hi后，且避免到处写layui.use()的麻烦。

layui.form(['form','upload']),function(){}

//如果只有一个模块，可以不填数组

layui.use('form',function(){var form = layui.form //获取form模块var upload=layui.upload;//获取upload模块//监听提交按钮form.on('submit(test)',function(data){console.log(data)});//实例化一个上传控件upload({url:'上传接口',success:function(data){console.log(data)}})
})

模块命名空间

layui的模块对象会绑定在layui对象上，内部由==layui.define()==方法来完成。
每个模块都有一个特定命名，且无法被占用。所以你无需担心模块的空间被污染，
除非你主动delete layui[‘模块名’].
调用模块可通过layui.use()来实现，再通过layui对象获得模块对象。
也就是用layui.use([‘layer’,‘laypage’,‘laydate’],function(){
var layer= layui.layer //获得layer模块
// 这样才可以使用模块哦

})

非常不推荐将模块暴露给全局

var laypage,laydata;
layui.use(['laypage','laydate'],function(){laypage=layui.laypage;laydate=layui.laydate;
})

// layui官方提供的模块有时可能还无法满足你，或者你试图按照layui的模块规范来扩展一个模块，
那么此时有必要认识一下layui.define()方法来完成。

第一步：确认模块名，假设为mymod,然后新建一个mymode.js文件放入项目任意目录下
第二步：编写mymode.js如下layui.define(function(exports){//提示：模块也可以依赖其他模块，如 layui.define('mod1',callback);var obj={hello: function(str){alert('Hello'+(str||'mymod'));}};//输出mymode接口exports('mymod',obj);})
第三步：设定扩展模块所在的目录，然后就可以在别的JS文件中使用了
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.mymodvar mod1=layui.mod1var mod2=layui.mod2mymod.hello('World!');//弹出Hello World!
}])

一些问题？

1. 为什么表单不显示
如果你的表单元素是动态添加的，那么在组件初始加载的时候是无法读取到的，你只需要执行一个试图渲染的实例就可以

layui.use('form',function(){var form=layui.form;//只有执行了这一部，部分表单元素才会自动修饰...form.render() //执行方法来渲染 这是全部渲染form.render('select'); //刷新select选择框渲染 ，这是局部渲染
})

layui文档通读笔记相关推荐

Qt文档阅读笔记-共享库的创建与调用
使用共享库的符号这个符号可以作用在变量.类.函数中,并且这些都可以被调用端使用. 在编译共享库中,需要使用export符号.在使用端调用的时候使用import符号. 这里是本人从文档中记录的笔记,大 ...
Qt文档阅读笔记-加载HeightMap(高度图)构造3D地形图
Qt文档阅读笔记-加载HeightMap(高度图)构造3D地形图 QHeightMapSurfaceDataProxy:是Q3DSurface的一个基本代理类. 他是专门加载高度图. 高度图是没有X, ...
Qt文档阅读笔记-Rotations Example相关
Rotations Example文档阅读笔记使用这种方式,对y轴和z轴进行旋转. QQuaternion yRotation = QQuaternion::fromAxisAndAngle(0.0 ...
layui文档网站下线必须做备份啊
起源搞这个事的主要原因是layui重要公告,内容如下: 所有对 layui 为之热爱.鞭策.奉献,和支持过的开发者: 请接受我用意念和字节传达的深深歉意.这是一个无力.无奈,甚至无助的决定:ayui ...
FreeRTOS官方指导文档阅读笔记
FreeRTOS官方指导文档阅读笔记基于 161204_Mastering_the_FreeRTOS_Real_Time_Kernel-A_Hands-On_Tutorial_Guide.pdf,可 ...
Leaflet文档阅读笔记-Quick Start Guide笔记
目录网络加载JS和CSS 初始化地图在地图上做标记在地图上点击事件获得坐标个人对这篇文档的体会网络加载JS和CSS 先要加载css,然后在加载js <link rel="st ...
python3.6安卓版-一些不错的文档网址--笔记【原创】
一些不错的内核文档网址 1. 轻松认识 Linux Kernel git clone https://git.kernel.org/pub/scm/linux/kernel/git/torvalds/ ...
【ember zigbee】序章:协议栈相关文档学习笔记
原文地址:https://blog.csdn.net/tainjau/article/details/90648114 文章目录写在前面一.材料出处二.文档解析 2.1.EZSP Protoco ...
《Web前端开发之HTML+CSS精英课堂【渡一教育】》文档版笔记（完结）
这个笔记本来是想先上文档版的,但由于里面有些标签会导致显示不出来,所以之前只上了个思维导图版的. 时隔好久,想发篇markdown版的博文时,一进来就看见这篇文档版的草稿,顺便学下markdown的写 ...
python 知识管理系统_MrDoc: 基于Python开发的Markdown在线文档系统，适合作为个人和小型团队的文档、笔记和知识管理工具...
MrDoc觅道文档 - 记录文档.汇聚思想个人和小型团队的笔记.文档.知识管理私有化部署方案简介 MrDoc 是基于Python开发的在线文档系统,适合作为个人和小型团队的文档.知识和笔记管理工具 ...