Javascript 如何添加自定义css以覆盖react confirm警报默认值

我正在使用

react confirm alert

中的确认弹出窗口：

popup=\u id=>{
确认员({
标题：“删除用户”，
信息：“你确定吗？”，
按钮：[
{
标签：“Ja”，
onClick:（）=>this.deleteUserHandler（\u id）
},
{
标签：“Nej”，
}
],
closeOnEscape：没错，
closeOnClickOutside：没错，
});
}

有没有一种方法可以改变它的风格？我可以这样设置覆盖层

.react确认警报覆盖{
背景：rgba（0,0,0,0.5）；

---

但是我不知道如何更改按钮、消息或标签。请提供帮助。

这是呈现的示例：

确认提交
你确定要这样做吗。
是的

您可以通过元素的类名（

.react confirm alert

、

.react confirm alert body

、

.react confirm alert button group

等）或使用子选择器来确定元素的目标（

.react confirm alert body h1

，

react confirm alert button group button

，

react confirm alert button group button:first child

等）

您还可以创建并传递您自己的自定义UI组件，您可以按照任何方式设置其样式：

confirmAlert({
customUI:（{onClose}）=>{
返回(
你确定吗？
是否要删除此文件
不
{
this.handleClickDelete（）；
onClose（）；
}}
className=“警报\uuuuBTN警报\uuuuBTN——是”
>
是的，删除它！
);
}
});

---

非常感谢，伙计，这是一个很好的开始，正是我想要的。如何将整个警报框居中？我尝试了填充、边距等操作，但没有移动。我甚至尝试过。反应确认警报{position:relative}不客气。这可能是一个新问题，但如果您尝试过

位置：相对
，您可以添加
顶部：50%；
将顶部移动到中间，并
转换：translateY（-50%）；
将其再次上移到方框的一半。您可能还需要添加
边距：auto
。如果上面的答案有助于解决您的问题，您可以通过单击旁边的复选标记按钮来接受我的答案；）我只是选中了：）。非常感谢你，非常感谢。在我的示例中，您知道如何定位消息（在询问“您确定吗？”之间的文本）吗？谢谢：）不幸的是，他们没有在消息周围添加
div
，因此它不是那么简单。您可以更改
.react confirm alert body
的样式，并更新
h1
和按钮的样式以将其更改回来。不太理想，但如果你不想添加自定义用户界面，这可能是最简单的。非常感谢你的朋友，非常感谢，祝你度过愉快的一天或一夜。