el-message-box 按钮互换位置

108 阅读1分钟

element plus的message-box按钮从左到右的顺序为取消、确认,但是老板的回路太特别的,人的思维都是从左往右看的,所以顺序应该是反过来,真是奇葩的需求。

image.png 没办法,只能上官网找,有没有互换的API,毫不意外人家团队根本不会想到这么奇葩的需求, 那只能写样式解决了吧。

image.png 两个Button采用的是flex布局,那就好解决了,直接flex梭起来

image.png

image.png

好了,在全局的css文件中加入这个样式,完美解决奇葩需求。
.el-message-box__btns{
   flex-direction: row-reverse;
   justify-content: end;
   gap: 12px;
}

遇到奇葩的事或人时,千万不要与他们争吵,毕竟他们的脑回路有问题的,是吵不过的,那只能加入#24