ElementUI常用的组件展示

文章目录

    • 1、要使用ElementUI先导入组件库
    • 2、自定义表头,可以改为添加和批量删除的按钮
    • 3、Dialog模态框,主要用于添加和修改时展示信息
    • 4、抽屉
    • 5、消息提示:用于提示是否操作成功
    • 6、询问:常用于询问是否确定删除
    • 7、批量选择复选框
    • 8、表单
    • 9、小图标、按钮等小元素
    • 10、时间格式化
    • 11、布局容器
    • 12、面包屑和页头
    • 13、气泡确认框
    • 14、卡片

@click="removeBatch"前端,左边是触发事件,右边是执行的函数

1、要使用ElementUI先导入组件库

在这里插入图片描述

2、自定义表头,可以改为添加和批量删除的按钮

在这里插入图片描述
在这里插入图片描述

3、Dialog模态框,主要用于添加和修改时展示信息

在这里插入图片描述
在这里插入图片描述

有时也会嵌套抽屉使用,例如:
在这里插入图片描述

4、抽屉

在这里插入图片描述

5、消息提示:用于提示是否操作成功

在这里插入图片描述

6、询问:常用于询问是否确定删除

在这里插入图片描述

7、批量选择复选框

一般都加在第一列:找到展示表格数据的部分加进去即可,一般要考虑获得选中的内容
在这里插入图片描述
@selection-change=“handleSelectionChange”,当selection-change触发时(复选框发生改变),就会调用后面的函数

8、表单

用于级联检索、用户名密码验证等
在这里插入图片描述

9、小图标、按钮等小元素

10、时间格式化

选择你需要的时间格式,便于做数据库关于时间的查询
在这里插入图片描述
format是显示的格式,value-format是送的时候以什么格式送

11、布局容器

你可以使用给出的案例做一个漂亮的侧边导航
在这里插入图片描述

12、面包屑和页头

一般用于左上角显示当前所在位置
在这里插入图片描述
在这里插入图片描述

13、气泡确认框

在这里插入图片描述
可以在下面选择气泡的事件:@confirm事件:点击确认后执行

14、卡片

用于展示图片等等
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若转载,请注明出处:http://www.pswp.cn/web/92185.shtml
繁体地址,请注明出处:http://hk.pswp.cn/web/92185.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

在电脑上可以存储文件并合理备份文件的工具用哪个?

每天被群消息、报表、PPT 轮番轰炸的上班族,最怕的不是加班,而是——文件突然失踪!别再把“CtrlS”当护身符,今天一口气测完 4 款热门“文件保险箱”,看看谁才真正配得上你的 Deadline。 敬业签 首先登场的是敬业签&am…

JavaWeb(04)

MyBatis 时一款优秀的持久层框架,用于简化JDBC的开发 The MyBatis Blog 目录 MyBatis入门Mybatis基础CRUDMybatis动态SQL Mybatis入门 快速入门 JDBC介绍 数据库连接池 lombok 准备工作(创建springboot工程,数据库表user,实体类User) …

统计学1:伯努利模型的参数估计与等价性分析

伯努利模型的参数估计方法 1. 统计学习方法三要素对比方法模型策略算法极大似然估计概率模型经验风险最小化数值解贝叶斯估计概率模型结构风险最小化解析解2. 极大似然估计 2.1 模型设定 设P(x1)θP(x1)\thetaP(x1)θ,则P(x0)1−θP(x0)1-\thetaP(x0)1−θ 2.2 似然…

游戏行业DDoS攻防实战指南

一、游戏DDoS攻击特征分析游戏行业DDoS攻击呈现高度复合化特征,攻击手段日益专业化。2023年Akamai监测数据显示,63%的游戏服务器攻击采用UDP反射放大(如NTP、Memcached协议)与HTTP慢速攻击(如Slowloris)相结…

[自动化Adapt] 录制引擎 | iframe 穿透 | NTP | AIOSQLite | 数据分片

链接:https://github.com/OpenAdaptAI/OpenAdapt/wiki/OpenAdapt-Architecture-(draft) docs:OpenAdapt OpenAdapt 是一个开源项目,旨在 记录 和 回放 用户在计算机上的交互行为。 它如同智能助手般 观察 我们的操作(鼠标点击、…

ipv6学习

ipv6的历史背景和及展望ipv6普及不够,ipv4快要用完。ipv6技术部分ivp6包头结构ipv6不允许分片,减轻中间设备压力。IPv6 包头结构可按字段分层解析,核心特点是 固定头部长度(40 字节) ,将可选功能移至扩展头…

软件定义汽车 --- 电子电气架构的驱动

我是穿拖鞋的汉子,魔都中坚持长期主义的汽车电子工程师。 老规矩,分享一段喜欢的文字,避免自己成为高知识低文化的工程师: 做到欲望极简,了解自己的真实欲望,不受外在潮流的影响,不盲从,不跟风。把自己的精力全部用在自己。一是去掉多余,凡事找规律,基础是诚信;二是…

HTML5 语义元素

HTML5 语义元素 引言 HTML5 作为现代网页开发的基础,引入了许多新的语义元素,这些元素使得网页内容更加结构化,便于搜索引擎更好地理解和索引页面内容。本文将详细介绍 HTML5 中的语义元素,并探讨其在网页设计中的应用。 HTML5…

vue3 el-select el-option 使用

在 Vue 3 中,el-select 是 Element Plus 组件库中的一个选择器组件,它允许用户从下拉菜单中选择一个或多个选项。如果你想在使用 Vue 3 和 Element Plus 时让 el-select 支持多种选择(即多选),你可以通过设置 multiple…

windows搬运文件脚本

使用方法:copy_files_by_prefix.bat [目标目录] [结果目录] [文件名前缀] [可选参数:文件包含内容]echo off chcp 65001 >nul setlocal enabledelayedexpansion:: Check parameters if "%~3""" (echo Usage: %~nx0 [SourceDir] […

C++ 中 initializer_list 类型推导

在 C 中,initializer_list 是一种用于表示列表初始化的标准库模板类,提供了一种方便的方式来初始化容器或者进行函数调用时传递一组参数。initializer_list&& 类型推导涉及到右值引用和移动语义,这在现代 C 中变得越来越重要。initia…

自动驾驶中的传感器技术22——Camera(13)

1、可靠性验证的目标车载摄像头作为自动驾驶和高级驾驶辅助系统(ADAS)的核心传感器,其可靠性直接影响到行车安全。可靠性验证的目标如下:暴露产品缺陷:在研制阶段,通过测试发现并修正产品设计中的问题&…

一周学会Matplotlib3 Python 数据可视化-图形的组成部分

锋哥原创的Matplotlib3 Python数据可视化视频教程: 2026版 Matplotlib3 Python 数据可视化 视频教程(无废话版) 玩命更新中~_哔哩哔哩_bilibili 课程介绍 本课程讲解利用python进行数据可视化 科研绘图-Matplotlib,学习Matplotlib图形参数基本设置&…

三万字带你了解那些年面过的Java八股文

Java基础 1. String 和StringBuffer 和 StringBuilder的区别? String 字符串常量 StringBuffer 字符串变量(线程安全) StringBuilder 字符串变量(非线程安全) 2. sleep() 区间wait()区间有什么区别? sleep…

HTML 媒体元素概述

HTML 提供了多种元素用于嵌入和控制多媒体内容&#xff0c;包括音频、视频、图像、画布等。以下是常用的 HTML 媒体元素及其用法&#xff1a;音频 (<audio>)<audio> 元素用于嵌入音频内容&#xff0c;支持 MP3、WAV、OGG 等格式。 示例代码&#xff1a;<audio c…

http请求结构体解析

copy了一个接口的curl用来说明http请求的三个结构&#xff1a;请求行&#xff0c;请求头&#xff0c;请求体 文章目录一、请求的curl报文示例二、解析1. 请求行&#xff08;Request Line&#xff09;2. 请求头&#xff08;Request Headers&#xff09;3. 请求体&#xff08;Req…

无人机遥控器舵量技术解析

一、舵量的核心作用1. 精确控制的核心 舵量值&#xff08;通常以PWM微秒值表示&#xff09;量化了操作指令的强度&#xff1a; 小舵量&#xff08;1000μs&#xff09;&#xff1a;对应舵机最小角度或电机最低转速&#xff1b; 中点&#xff08;1500μs&#xff09;&#xf…

Git分支相关命令

在 Git 中&#xff0c;分支管理是非常重要的一部分。下面是一些常用的 Git 分支操作命令及其示例。 1. 查看所有分支 要查看项目中的所有分支&#xff08;包括本地和远程&#xff09;&#xff0c;可以使用&#xff1a; git branch -a仅查看本地分支&#xff1a;git branch2. 创…

Apache Flink 的详细介绍

Apache Flink 是一个开源的分布式流处理框架&#xff0c;专注于高吞吐、低延迟、 Exactly-Once 语义的实时数据处理&#xff0c;同时也支持批处理&#xff08;将批数据视为有限流&#xff09;。它广泛应用于实时数据分析、实时 ETL、监控告警、欺诈检测等场景&#xff0c;是当前…

Qt 常用控件 - 5

Qt 常用控件 - 4https://blog.csdn.net/Small_entreprene/article/details/149830464 前文补充 QRadioButton&#xff08;单选按钮&#xff09; QRadioButton 是单选按钮&#xff0c;允许在多个选项中选择一个。作为 QAbstractButton 和 QWidget 的子类&#xff0c;前面介绍…