首页 > 其他分享 >Layui 组件化

Layui 组件化

时间:2023-01-16 18:35:32浏览次数:27  
标签:jQuery mevent 时代 Layui param 致敬 组件

时代的车轮滚滚向前,哪些属于每个时代的英雄变成了那个时代的印记,就像贤心说的 这是一种带有热量的冰冷感!

我们选择了 IT 这个行业,自然希望能够在这里走得更远。而那些大神创造的框架则让我们看得更远,2006年1月,约翰 · 雷西格发布了 jQuery 的第一个版本,就让我们进入了 jQuery 时代;尤雨溪创造了 Vue,使我们正式迈入 Vue 的时代。这些领军者,让我们的工作和生活变得更加简单。

我们与这些领军者相去甚远,微不足道,但依然有很多IT人在默默地用自己的行动来帮助一些人,让我们可以少走一些弯路、少踩一些坑。

借此机会,在这里向LayUI致敬,向贤心大神致敬,向jQuery致敬!


使用:

noticetab.html

<!--不要写html标签-->
<div class="wrapper-header-fix">
	<h1>11111</h1>
</div>

主页加载组件

<!DOCTYPE html>
<html>
	....
	
	<div id="noticeDiv">
</html>
	layui.$("#noticeDiv").load("component/noticetab.html", function(){
		console.log('load success')
	});

组件化之后页面如何与组件之间进行交互?


定义监听

window.addEventListener('upd_info',function(e){
		console.log(e.detail);
	})

调用

var param = {name: '张三'}
var mevent = new CustomEvent('upd_info', {
      // param 是要传的参数
	  detail:param
});
window.dispatchEvent(mevent);

标签:jQuery,mevent,时代,Layui,param,致敬,组件
From: https://blog.51cto.com/u_14452299/6010723

相关文章

  • vue iframe组件封装
    界面内嵌iframe时,由空白节点引起底边间距,可设置iframe属性vertical-align:top解决<template><divv-loading="loading":style="'height:'+height"><iframe......
  • Log4Net组件的应用详解
     第一步:添加并应用Log4net.dll。然后在Web.config文件中添加下面的配置局<configSections><sectionname="log4net"type="log4net.Config.Log4NetConfigurationSectionH......
  • Vue.js框架:引入Element-ui和国际化i18n组件冲突及兼容问题处理
    一、问题如下要使用element-ui的表格时,在main.js中同时全局引入了element和i18n时,页面会报错如下:Errorinrender: TypeError:Cannotreadpropertiesofund......
  • 界面组件DevExpress WPF v22.2最新版本系统环境配置要求
    DevExpressWPF 拥有120+个控件和库,将帮助您交付满足甚至超出企业需求的高性能业务应用程序。通过DevExpressWPF能创建有着强大互动功能的XAML基础应用程序,这些应用程序......
  • 27.PyQt5【高级组件】浮动窗口-QDockWidget
    一、前言Qt提供QDockWidget停靠窗口控件来实现浮动窗口的功能,QDockWidget停靠窗口控件一般使用在QMainWindow中,它是放置在QMainWindow中的中央窗口小部件周围的停靠窗口小......
  • 14.PyQt5【基本组件】单选按钮-QRadioButton
    一、前言QRadioButton类对象呈现一个带有文本标签的可选按钮。用户可以选择表单上显示的许多选项之一。该类派生自QAbstractButton类。默认情况下,单选按钮是自动排他的......
  • 13.PyQt5【基本组件】普通按钮-QPushButton
    一、前言在任何GUI设计中,命令按钮都是最重要和最常用的控件。任何计算机用户都熟悉带有保存、打开、确定、是、否和取消等作为标题的按钮。在PyQtAPI中,QPushButton类......
  • 15.PyQt5【基本组件】复选按钮-QCheckBox
    一、前言当文本标签前出现一个矩形框时QCheckBox对象被添加到父窗口。就像QRadioButton一样,它也是一个可选择的按钮。它的常见用途是在要求用户选择一个或多个可用选项......
  • 16.PyQt5【基本组件】下拉列表-QComboBox
    一、前言QComboBox提供一个下拉列表,其中包含可供选择的项目。只显示当前选定的项目所需的窗体上的最小屏幕空间。二、学习目标1.QComboBox常用方法2.QComboBox常用信......
  • 18.PyQt5【基本组件】进度条对话框-QProgressDialog
    一、前言QProgressDialog进度对话框,向用户提示程序中当前任务的进度信息,用以提示当然任务正在进行,并按百分比显示进度。对话框提供了一个取消按钮,用以向用户提供终止操......