- 综合排序
- 最热优先
- 最新优先
- 来自专栏程序员的碎碎念
Layer弹层组件
前几天了解到这个不错的弹层插件，样式好看，用起来也方便。 喜欢的人看完我的博客也可以看官方网站哦：http://www.layui.com 在这个官方网站里有关于它的基础参数： type（基本层类型），title（标题），content（内容），skin（样式类名 options, yes, cancel) - 询问框， layer.msg(content, options, end) - 提示框， layer.load(icon, options) - 加载层
2K50发布于 2018-03-06 - 来自专栏技术文章
改造 layer 弹层移动版组件
序 我们决定在自研的Craneoffice.net框架中，引入 layer弹出层移动版，无须引用 jquery，改造思路是用不同颜色的样式表达不同的警告级别，另外通过一些代码，解决不能嵌入或嵌入 iframe 演示视频 改造版layer组件演示视频 添加了一个方法 添加了 layer.gt(type) 方法，该方法用于便捷的设置警告类型样式，返回值为样式字符串。 小结 这是我们引用的layer弹出层的早期组件，属于移动版，针对其中的改造只是体现了自己的一些设计想法，希望大家批评指正。
46410编辑于 2024-06-20 - 来自专栏h5
RLayer：基于React.js多功能弹层组件
介绍 RLayer.js 一款基于react.js构建的pc桌面端自定义弹出层组件。拥有精致的UI及极简的调用方式，支持顺滑拖拽、缩放及最大化等功能，让复杂的弹框场景变得简单化。 灵感来源于之前开发的一款vue pc端自定义弹框组件VLayer。 基于Vue.js PC桌面端弹出框组件|vue自定义弹层组件|vue模态框 026360截图20201201174654884.png 引入组件 // 引入组件RLayer import rlayer /** * 参数配置 */ static defaultProps = { // 参数 id: '', // {string} 控制弹层唯一标识 : true, // {bool} 是否点击遮罩层关闭弹框 lockScroll: true, // {bool} 是否弹框显示时将body滚动锁定
3.1K60发布于 2020-12-07 - 来自专栏编程进阶实战
关于Layer web弹层组件的加载(loading)层位置居中问题
最近在项目中一直使用layerui的相应的提示框以及它的加载层，然而就在今天遇到了一个神奇的问题，我使用 var index = layer.load(0, {shade: false}); 结果一直偏左无法居中 Layer Web弹出层组件地址：https://layer.layui.com/ Layui前端框架地址：https://www.layui.com/
2.1K10编辑于 2022-02-15 - 来自专栏全栈程序员必看
弹框遮罩层「建议收藏」
--背景隐藏层-->
<! --弹出层--> <! --end弹出层--> .cityPopBox{ overflow-y:auto; position: fixed; height:400px; widht:600px;2.2K10编辑于 2022-07-28 - 来自专栏技术综合
vue实现弹框组件
document.body.style.height = 'unset' document.body.style['overflow-y'] = 'auto' } 切换页面或其他情况, 需要清除添加到body里的弹框 $el) } } 组件源码 <template> <transition name="fade">
2.6K30发布于 2020-08-25来自专栏前端小叙vue项目子组件使用 dialog 弹框，如何实现父子组件弹框展示状态关联？
vue 项目，子组件使用 el-dialog 组件，想要实现在父组件可以控制子组件 dialog 的展示和隐藏，子组件自己可以控制 dialog 展示和隐藏，该如何实现？ 1. 子组件（DialogComponent.vue） 子组件接受一个来自父组件的 prop，用来控制 dialog 的显示状态，并且当子组件内部需要改变 dialog 状态时，通过 $emit 发送一个事件给父组件 父组件 在父组件中，你定义一个变量来控制 dialog 的显示，并将这个变量传递给子组件作为 prop。同时，监听子组件发出的 update:visible 事件来更新这个变量。 组件间的通信：通过 props 和自定义事件（emit）是 Vue 组件间通信的基本方式之一，适用于父子组件之间的通信。 这样，父组件和子组件就可以通过 showDialog 变量来双向控制 el-dialog 的显示了。
4.1K11编辑于 2024-07-04来自专栏全栈程序员必看layui弹框传值_LAYUI弹出层详解
引入好相关文件就可以开始啦 今天放图片把 试着学一下放图片 1.最简单的弹层，这个弹层的效果其实就是一个加了特效和样式的alert();代码如下： layui.use(“layer”, function () { var layer = layui.layer; layer.msg(“大家好，这是最简单的弹层”); }); 以上直接放到HTML页面就OK。 运行效果就出来了 效果就是这样了 他有一个默认的time基础参数 表示弹出来多久后自动关闭 默认好像是3000MS. time更改方法：layer.msg(“大家好，这是最简单的弹层”, {time: 文本‘, ‘font-size:18px;‘]，数组第二项可以写任意css样式；如果你不想显示标题栏，你可以title: false title实例： 代码：layer.msg(“大家好，这是最简单的弹层 代码： 点我测试弹出层 layui.use(“layer”, function () { var layer = layui.layer; //layer.msg(“大家好，这是最简单的弹层”,
1.5K10编辑于 2022-09-05来自专栏全栈程序员必看应用层,驱动层,硬件层_windows组件向导在哪里
驱动层与应用层通信是通过DeviceIoControl， 符号定义 #define DEVICE_NAME L"\\Device\\myDriver" // Driver Name \myDriver 首先驱动层要实现： pDriverObject->DriverUnload = UnloadDriver; pDriverObject->MajorFunction[IRP_MJ_CREATE IoStatus.Status = STATUS_SUCCESS; IoCompleteRequest(Irp, IO_NO_INCREMENT); return status; } } 然后应用层要打开驱动层的设备链接符号 因为没有把返回值status调整为STATUS_SUCCESS，只是等于了一个初始化不会STATUS_SUCCESS的值 3.DeviceIoControl传到驱动层了，但是没有读到数据 一开始是读到了的 ，后来因为排查问题的时候以为是CtlCode的问题，于是随意调整了一下MY_CTL_CODE的第三个参数METHOD_BUFFERED，凑巧发现这个值影响到驱动层读取DeviceIoControl传递的数据
82430编辑于 2022-10-04来自专栏全栈程序员必看小程序弹框组件_小程序怎么创建
微信小程序提供的弹框模版就3种： 1、消息提示框 对应的效果是这样的 这一种ui我们可以改变的额只有icon、image、title 2、模拟对话框 对应的效果是这样的： 这一种做一些危险操作的提示之类等 3、显示操作菜单 对应效果如下： 这种可以用来填写某些选择行的信息 看了以上3种弹框，发现和我们Ui差距较大，都用不上。 于是我自己写一个我的页面专用的弹框，具体效果如下图： 以下是代码贴图 最外层的phoneWin样式主要是写后面的遮罩层，content就是具体的弹框区域 弹框的显示隐藏用wx:if控制 然后就可以在弹框中写自己想要展示的效果啦
3.8K10编辑于 2022-08-04来自专栏远在上海推荐优秀弹出层组件：layer
官网地址：http://layer.layui.com/ 当前版本：2.3（2016-05-18 更新） 官方的介绍： layer是一款近年来备受青睐的web弹层组件，她具备全方位的解决方案，致力于服务各水平段的开发人员 在与同类组件的比较中，layer总是能轻易获胜。 她数量可观的接口，使得您可以自定义太多您需要的风格，每一种弹层模式各具特色，广受欢迎。当然，这种“王婆卖瓜”的陈述听起来总是有点难受，因此你需要进一步了解她是否真的如你所愿。 Fly 我实际使用中用了iframe父子层交互，以及msg,alert等，今天将一个封装的C#弹出对话框代码分享一下： #region public static void
1.4K20发布于 2019-02-26来自专栏月亮与二进制iOS第三方弹层KLCPopup的使用
很多时候使用一个弹层来提供一个小界面进行提示、选择什么的功能是很有用而且美观的，比如很多广告就是这种弹层的形式...有了弹层以后，我们不需要每次要显示一个东西的时候都跳转到另一个界面中去，当只用显示一点小东西的时候 ，弹层的价值远远大于新开一个界面，之前使用到了第三方的弹层KLCPopup，当时的需求是要能在弹层上填写内容以及添加按钮，试了几种弹层后发现这种最能满足需求也挺好用的，于是就用了下来，这里说一说简单的使用方式吧 第四个参数maskType，这个参数是决定弹层底部界面的样式，也就是说，当你从一个界面点出弹层时，原来那个界面会在弹层的下方，而这个参数就可以让你决定下方那个界面是什么样子，比如变模糊。 第六个参数dismissOnContentTouch，同样是布尔型，决定当点击弹层本身时，是否退出弹层。 弹层出现后，除了刚才设定的点击背景或弹层本身时退出弹层外，也可以设定在其他时候退出，比如点击弹层上的一个按钮时调用方法退出，只要在点击按钮时运行： [popupView dismiss:YES];
71320发布于 2021-11-23来自专栏爱明依页面弹出层组件layer的用法
种层类型。 可传入的值有：0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）。 提供了两种风格的关闭按钮，可通过配置1和2来展示，如果不显示，则closeBtn: 0 是否点击遮罩关闭 类型：Boolean，默认：false 如果你的shade是存在的，那么你可以设定shadeClose来控制点击弹层外区域关闭 当你在页面一打开就要执行弹层时，你最好是将弹层放入ready方法中，如： /页面一打开就执行弹层 layer.ready(function(){ layer.msg('很高兴一开场就见到你'); }); 原始核心方法 基本上是露脸率最高的方法，不管是使用哪种方式创建层，都是走layer.open()，创建任何类型的弹层都会返回一个当前层索引，上述的options即是基础参数，另外，该文档统一采用options
5.1K20发布于 2019-03-12来自专栏云前端复用 Vue 组件的 6 层手段
配置 对于某些组件，使用起来是需要变化的。 一个 Button 组件会有个基本的样子，或许也要支持带个图标。与其为每个版本都重新创建一整个新组件，不如使用属性切换其类型。 要预见并支持未来的需求，就得向组件中加入很多属性。 但如果让组件变得“可适配”，在不用改变组件的前提下，就能让其支持我们甚至未曾设想到的场景。 扩展 使用 Vue 中的 named slots (具名组件) 可以在组件中添加一个或多个扩展点。再结合上述的适配和反转，就具备了最大化组件复用性的必要技术。 嵌套 如果我们将“扩展点”逐层传递，就能达到最终目的。这乍听起来有点繁琐，但确实有用，特别是在大型应用的环境中。 总结 本文列出了复用 Vue 组件的 6 层手段。这说不上是全部，或许还有其它手段，但已经足够实用了。
52330发布于 2020-07-02来自专栏Web技术学苑分享一篇关于弹框组件设计思考
通常业务代码 我们的页面上有个操作，打开弹框，你肯定是会在引入第三方弹框组件后，你会发现很多地方都会写这样的模版代码 "use client" import { Button, Dialog, DialogPanel 通常我们这样做，好像也并没有太多的变化，所有的状态都是在父组件控制，那么这些状态能不在父组件控制，直接写在弹框里面吗 因此我们继续改造了这个弹框 // components/modal2.tsx "use ，我们引入这个组件,我们把弹框所有组件状态都放在了弹框内部，只传入了弹框所需要的title,以及触发弹框的按钮文案，还有弹框内部内容，这样我们的弹框比以前更简单了。 在我们认为这个弹框组件非常好用时，有时候，你想在父组件通过事件打开这个弹框，因此你需要父组件调用子组件的方法，将这个组件能力变得更强了，我只需要使用forwardRef与useImperativeHandle 总结 普通弹框在业务中的运用，以及二次封装一个弹框组件 将弹框所有应用的 state 封装到弹框内部，减少外部状态的重复定义 使用forwardRef与useImperativeHandle将父组件 ref
29600编辑于 2025-06-19来自专栏一“技”之长理解iOS端的WebView同层组件
理解iOS端的WebView同层组件 一 起始 同层渲染是利用原生技术来优化Web渲染一种技术，很多人了解它是起于微信开放社区发布的一篇关于小程序渲染原理剖析的文章。 二 原理 同层组件的目标是将原生组件渲染在与其他Web组件同一层级中。 -- 弹框 -->
弹窗提示</body> </html> 上面代码中，蓝色的色块就是同层组件容器。 三 尝试 了解了同层组件原理后，我们可以在iOS平台上做下尝试，体验同层组件的渲染效果。 原生端可能需要一个容器池来维护被插入的同层组件，方便通过id寻找来进行更新等。 某些CSS属性对于同层组件可能并不能生效，也是需要通过JS传递数据到原生端处理。4.3K20编辑于 2023-01-01来自专栏RattenkingTaro React组件使用（1） —— Overlay 遮罩层【渐入渐出动画遮罩层】
Overlay 遮罩层 ---- 提供一个简单的 Overlay 遮罩层，在页面上的层级为 1026; 1. 使用指南 在 Taro 文件中引入组件，将组件放入src下的components文件夹中 import RuiOverlay from "../.. 基础用法 2.1 组件使用 {/* 基本案例 */} <RuiOverlay isOpened={isShowBase} onClose={() => { this.setState({ isShowBase 嵌入内容居中 3.1 组件使用 {/* 嵌入内容居中 */} <RuiOverlay isOpened={isShowContent} onClose={() => { this.setState( RuiOverlay 参数 参数 说明 类型 可选值 默认值 isOpened 是否显示遮罩层 Boolean - false zIndex 页面上的层级 Number - 1026 opacity 遮罩层的透明度
2.5K20编辑于 2022-11-02来自专栏前端大合集面试题分享之封装一个弹框组件
题目 题目为: vue3中实现一个父页面的弹窗功能，描述显隐和传参的实现逻辑，（效果截图和关键代码截图） 大概的解题思路 创建一个弹框组件弹框.vue 存放于components目录下 使用defineProps 用来获取在父组件中给当前弹框组件传递的值. 明确一个弹框组件应该有哪些结构 header_title: 左上角标题 main_content: 中间弹框的内容 footer_operation: 底部操作栏 取消. 确认. 其中 标题和内容由父组件传递, 而取消和确认事件需要提供给父组件使用. 操作 弹框组件的定义 新建一个弹框组件, 编写基本结构和css样式代码. 在子组件 (MyDialog) 中： visible 属性的值从父组件传递过来，并通过 v-if 控制弹框的显示与隐藏。 用户点击弹框内的 “确定” 按钮时，触发 confirm 方法。
49210编辑于 2024-07-29来自专栏前端随笔学用Hook写React组件——通用弹出层
秉承后期的可维护性和减少相同代码目的，开始对所有弹框进行分析。 分析了各种花式弹框后，得出可变部分为： 弹出层内容 是否能通过蒙层关闭弹出层 蒙层样式 渲染位置 是否默认显示 转化为接口如下 interface ProtalOptions { children isShow) return null; return ReactDOM.createProtal( //这里定义了一个Wrap组件，作用是对蒙层的样式修改和对蒙层点击事件的控制 isShow]); // 这里对closeOnOutSide, rootContainer没有进行依赖，是希望这个两个值不能动态修改，减少不必要的渲染问题 // ...略 } Wrap组件的作用组要是对蒙层样式的定义和蒙层本身点击事件的控制与否 ，是因为本身页面每个弹框动画方式都会不同，封装动画会减少本身的扩展性。
2.2K20编辑于 2022-10-05来自专栏测试开发干货【deepseek用例生成平台-28】需求优化弹层开始优化后台功能
我们交给一个全新的函数去做： AIsend_begin_set 这样的设计，其实就很正式了，views.py中的begin_set作为视图逻辑层，专门负责跟前端交互数据用，真正处理业务的独立出一个业务层函数
26210编辑于 2025-04-21
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号