对layui中的onevent 和event的使用详解

这是官方文档的说明

layui.onevent(modName, events, callback) 自定义模块事件，属于比较高级的应用。有兴趣的同学可以阅读layui.js源码以及form模块
layui.event(modName, events, params) 执行自定义模块事件，搭配onevent使用

参数1我暂时理解为组，定义子级方法和使用event调用都需要注意这个参数必须一致

参数二是定义父级方法名，如果有需要定义该方法的子方法时候同样使用onevent,但参数二的方法名需要与父级相同并已加上括号

如下面的代码中data方法，定义子方法就是data(1),

如果使用layui.event方法调用data(1)，方法即会data(1)和data方法

      //监听Tab切换，以改变地址hash值
      element.on("tab(test)", function() {
        // location.hash = "test=" + this.getAttribute("lay-id");
      //使用event调用data(1)方法并传入参数，这时候这里会触发data方法和data(1)方法
        layui.event('groupData','data(1)',this.getAttribute("lay-id"));
      });
      //定义父级方法data
      layui.onevent('groupData','data',function(gid){
          console.log(gid);
      });
      //定义子方法data(1)
      layui.onevent('groupData','data(1)',function(gid){
       console.log(1321321);
      });

以上均为本人使用经验理解，如有说错，欢迎大家指出！

这篇对layui中的onevent 和event的使用详解就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • 对layui中表单元素的使用详解

    首先不管是单选框还是复选框或者是下拉框,都要在你写的标签外面套一层div或者是form标签,如: <div class="layui-input-block"> <input type="radio" name="sex" value="0" title="男"> </div>,class属性是固定写法. 这样写好了以后,你如果是写在静态页面,这样式可以看见效果,如果写在

  • 对layui中的onevent 和event的使用详解

    这是官方文档的说明 layui.onevent(modName, events, callback) 自定义模块事件,属于比较高级的应用.有兴趣的同学可以阅读layui.js源码以及form模块 layui.event(modName, events, params) 执行自定义模块事件,搭配onevent使用 参数1我暂时理解为组,定义子级方法和使用event调用都需要注意这个参数必须一致 参数二是定义父级方法名,如果有需要定义该方法的子方法时候同样使用onevent,但参数二的方法名需要与父

  • 基于js中this和event 的区别(详解)

    今天在看javascript入门经典-事件一章中看到了 this 和 event 两种传参形式.因为作为一个初级的前端开发人员平时只用过 this传参,so很想弄清楚,this和event的区别是什么,什么情况下用什么比较合适. onclick = changeImg(this)       vs     onclick = changeImg(event) <img src='usa.gif' onclick="changeImg(event)" /> <scrip

  • C#中WPF ListView绑定数据的实例详解

    C#中WPF ListView绑定数据的实例详解

    C#中WPF ListView绑定数据的实例详解 WPF中ListView用来显示数据十分方便, 我们可以将它分成几个列,每一个列用来显示一条数据,但是又是在一方之中. 那么怎样实现这样的效果的呢,这就要用绑定了. 我们先来看一看他的xmal代码 <ListView Name="receiveList" Grid.Row="0"> <ListView.View> <GridView> <GridView.Columns>

  • Android MotionEvent中getX()和getRawX()的区别实例详解

    Android MotionEvent中getX()和getRawX()的区别实例详解

    Android MotionEvent中getX()和getRawX()的区别实例详解 实例代码: public class Res extends Activity implements View.OnTouchListener { Button btn = null; int x = 0; int y = 0; int rawx = 0; int rawy = 0; @Override public void onCreate(Bundle savedInstanceState) { sup

  • 基于vue.js中事件修饰符.self的用法(详解)

    .self可以理解为跳过冒泡事件和捕获事件,只有直接作用在该元素上的事件才可以执行. 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>self</title> <script src="vue.js"></script> <!--'''''''

  • 基于layui框架响应式布局的一些使用详解

    写在前面的 因为公司的需要,这几天学习了layui框架,稍微有一些心得.介绍就不多说,贴上官网的说明文档,目前是2.0版本,上面有很详细的介绍. 官网地址:https://www.layui.com/doc/element/layout.html 简单的布局 layui的响应式使用十分简单,虽然官网写了很多很详细,但某种意义上增加了新手学习的难度和劝退的可能.但其实总结下来如何使用响应式布局就几个步骤: 第一,在第一个div设置一个布局类 ,通常我只使用两个类,分别是:layui-contain

  • layui lay-verify form表单自定义验证规则详解

    官方文档详见:https://www.layui.com/doc/modules/form.html#verify 虽然layui的官方文档已经是写的比较详细,但是初次使用的时候总会懵一下,这里纪录一下lay-verify自定义验证规则的时候到底放哪. html: <input type="text" lay-verify="digital" placeholder="请输入数字"> <button type="but

  • layui写后台表格思路和赋值用法详解

    layui.form 模块用法总结. 基于layui做 表单 赋值 取值 思路 一. 初始一个方法用来给弹窗赋值,一种赋值,是按数据赋值,一种是清空数据 function initContorl (data){ //传数据 赋值为数组 不传数据赋值为空 if(data){ form.val("control",data) }else { form.val("control", { "name1": "", ,"nam

  • element中el-container容器与div布局区分详解

    用于布局的容器组件,方便快速搭建页面的基本结构: el-container:外层容器.当子元素中包含 或 时,全部子元素会垂直上下排列,否则会水平左右排列. el-header:顶栏容器. el-aside:侧边栏容器. el-main:主要区域容器. el-footer:底栏容器. 以上组件采用了 flex 布局,elemen-ui官方文档链接: http://element-cn.eleme.io/#/zh-CN/component/container 此外,el-container 的子元

  • Python中如何创建和运行异步任务详解

    目录 正文 1. 什么是异步任务 2. 如何创建任务 2.1. 高级 API 2.2. 低级 API 3. 任务何时运行? 正文 您可以从 asyncio 程序中的协程创建任务对象.任务提供独立调度和运行的协程的句柄,并允许查询.取消任务,以及稍后检索结果和异常.异步事件循环管理任务.因此,所有协程都成为事件循环中的任务并作为任务进行管理. 让我们仔细看看 asyncio 任务. 1. 什么是异步任务 异步任务是一个调度并独立运行 asyncio 协程的对象.它提供了一个调度协程的句柄,asyn

随机推荐