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(() => {
});
},
}