elementUI中MessageBox.confirm()默认不聚焦问题处理

在项目中使用elementUIMessageBox.confirm()出现了默认不聚焦的问题,默认确认按钮是浅色的,需要点击一下才会变成正常。面对这种问题,创建新组件,实现聚焦。替换默认的MessageBox.confirm()

  • 解决
  1. 创建components/MessageBoxConfirmWrapper/index.js
js 复制代码
import { MessageBox } from 'element-ui'

export default (...args) => {
	setTimeout(() => {
		document.activeElement?.blur()
	}, 0)
	return MessageBox.confirm(...args)
}
  1. 使用
js 复制代码
import MessageBoxConfirmWrapper from '@/components/MessageBoxConfirmWrapper'
MessageBoxConfirmWrapper('确定要退出当前账号?', '退出确认', { 
	type: 'warning'
 	})
	.then(() => {})
	.catch(() => {})
相关推荐
白水清风几秒前
Vue3之渲染器
前端·vue.js·面试
刘永胜是我5 分钟前
解决Volta环境下npm全局包卸载失败:一次深入排查之旅
前端·node.js
白水清风6 分钟前
Vue3之组件化
前端·vue.js·面试
luckyPian8 分钟前
ES6+新特性:ES7(二)
开发语言·javascript·ecmascript
边洛洛9 分钟前
解决[PM2][ERROR] Script not found: D:\projects\xxx\start
前端·javascript
农夫山泉的小黑23 分钟前
【DeepSeek帮我准备前端面试100问】(十八)Reflect在vue3的使用
前端·面试
Achieve前端实验室30 分钟前
【每日一面】手写防抖函数
前端·面试·node.js
三十_34 分钟前
TypeORM 多对多关联篇:中间表、JoinTable 与复杂关系的建模
前端·后端
_pengliang35 分钟前
React Native 使用 react-native-credentials-manager 接入谷歌登录教程
javascript·react native·react.js
用户68833620597035 分钟前
移动端 Web 性能调优:viewport、dvh 与触控优化解析
前端