当前位置: 首页 > ds >正文

element-MessageBox 弹框组件 调整按钮位置(确认在左,取消在右)、删除场景回车调取消事件,默认调确认事件

1、调整按钮位置(确认在左,取消在右)

// MessageBox 弹框 调换按钮位置
.el-message-box__btns {display: flex;flex-direction: row-reverse;
}
.el-message-box__btns button:nth-child(2) {margin-right: 10px;
}

在这里插入图片描述

2、删除场景回车调取消事件,默认调确认事件

组件默认焦点在确定按钮,尝试改变焦点到取消按钮,结果均无效!只能通过下列方法进行‘拦截’了。

//在组件的 created 或 mounted 钩子中监听键盘事件,当按下回车键时,手动关闭 MessageBox。
created() {document.onkeydown = (e) => {var key = window.event.keyCode;//this.$msgbox 可直接使用if (key === 13 && document.querySelector('.delmsg-focus-cancel')) this.$msgbox.close();};},
methods: {deep_deletefile(id) {this.$confirm('文件删除后将无法恢复,您确认要彻底删除所选文件吗?', '提示', {confirmButtonText: '确定',cancelButtonText: '取消',type: 'warning',roundButton: true,cancelButtonClass: 'delmsg-focus-cancel',//重点:自定义样式}).then(() => {//确定:调接口删除}).catch(() => {});},
}
http://www.xdnf.cn/news/13756.html

相关文章:

  • 串口通信入门基础
  • 【Linux】Makefile基础
  • Halcon深度图转换(real、uint2、byte)
  • 基本多线程编译make命令
  • 达梦数据库raw绑定磁盘-DSC集群部署
  • 再说一说LangChain Runnable接口
  • 禁止虚拟机里的Win10的Windows Defender
  • 【热更新知识】学习一 Lua语法学习
  • 【学习笔记】计算机操作系统(六)—— 输入输出系统
  • 基于 Spring AI 的 MCP 客户端/服务端实现
  • Java中的设计模式:23种经典模式在实际项目中的应用案例
  • 一款包含150个APP移动端网站UI的psd适用于服装鞋类社交电商项目
  • 论文略读:Mixture-of-Agents Enhances Large Language Model Capabilities
  • 力扣HOT100之贪心算法:55. 跳跃游戏
  • 如何在 Docusign 批量发送信封?
  • Cesium 常见方法汇总
  • Qwen家族系列模型概述
  • TripGenie:畅游济南旅行规划助手:个人工作纪实(二十四)
  • 用python判断一串字符是否属于中文的6种方法
  • 3 Studying《深入理解Android卷(邓凡平)》1
  • 【kafka】消息模型与工作原理详解
  • 如何抓取DP_AUX辅助通道数据
  • 在代码中使用uView里calendar中的Slot, tooltip 插槽
  • SQL 注入(SQL Injection)
  • UE5 学习系类(七)导入bridge资产包
  • CodeForces 228D. Zigzag
  • Master PDF Editor:全能PDF编辑工具
  • ElasticSearch聚合查询从15秒到1.2秒的深度优化实践
  • MySQL表的增删改查(基础)
  • 最新华为 HCIP-Datacom(H12-821)