Maison > interface Web > Tutoriel Layui > Introduction aux méthodes sous-jacentes de Layui

Introduction aux méthodes sous-jacentes de Layui

Libérer: 2019-12-21 17:29:35
avant
3005 Les gens l'ont consulté

Introduction aux méthodes sous-jacentes de Layui

Utilisation de la page modulaire Layui :

Charger les modules selon les besoins

//引入js,css文件跳过,看文档

//在页面中,如同编写JavaScript一样
<script>
	layui.use([&#39;layer&#39;,&#39;form&#39;],function(){//需要加载的模块
        var layer = layui.layer,
        form = layui.form;//初始化模块变量
        
        layer.msg(&#39;Hi!&#39;);//调用该模块的方法
	})
</script>
Copier après la connexion

Charger tous les modules à la fois

<script>
	;!function(){
      var layer = layui.layer
      ,form = layui.form;//初始化模块变量

      layer.msg(&#39;Hello World&#39;);
    }();
</script>
Copier après la connexion

Module auto-écrit

//js文件
layui.define([&#39;layer&#39;],function(exports){//自写模块需要调用的layui模块
    var layer = layui.layer;//初始化模块变量
    
    layer.msg(&#39;Hi!&#39;);
    
    exports(&#39;index&#39;,{})//导出自写模块,index为导出名,use的时候名字要和导出一致
})

//use时注意需要设定模块所在目录
<script>
	layui.config({
        base:&#39;/res/js/modules/&#39; //自建模块所在目录
	}).use(&#39;index&#39;,function(){//加载入口
        
	});
</script>
Copier après la connexion

Opérations de stockage local

layui.data(&#39;test&#39;,//test表名
    {//对象
        key:&#39;user_name&#39;,//键值对
        value:&#39;用户1&#39;
    }
)

//删除
layui。data(&#39;test&#39;,{
    key:&#39;user_name&#39;,//需要删除的键
    remove:true//删除
})

//查
var local = layui.data(&#39;test&#39;);
console.info(local.user_name);

//根据删除的方法,我暂时认为,如果需要插入多个键值对,需要使用对象数组,而删除多个键值对,则未知了,因为没实际操作,因为本地存储其实不怎么会用这个,接入后端后大多用session或者redis
Copier après la connexion

Diverses méthodes sous-jacentes qui peuvent ne pas être utilisées dans la pratique

layui.device()//获取设备信息
layui.cache()//获得缓存
layui.extend(options)//拓展别名,给一个模块设置别名
layui.each(obj,fn)//对象(array,object,dom)遍历,可取代for
layui.getStyle(node,name) //获得dom节点的style属性值,如document.body,&#39;font-size&#39;
layui.img(url,callback,error)//图片预加载,可设置加载失败显示默认图从而避免图片加载失败没图的尴尬
layui.router()//获得路由
layui.hint()//向控制台输出异常,目前只能error,layui.hint().error(&#39;error&#39;)
layui.stope(e)//阻止事件冒泡
layui.onevent(modName,events,callback)//自定义模块事件
layui.event(modName,events,params)//执行自定义事件
layui.factory(modName)//获取模块定义时的回调函数
Copier après la connexion

Pour plus de connaissances sur Layui, veuillez prêter attention au Tutoriel d'utilisation de Layui colonne.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:csdn.net
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal