Reactjs react引导sweetalert完全没有样式

我在呈现甜蜜警报时遇到问题。它为我显示，但没有任何样式，只有一个带有小默认按钮的白色框。当我把鼠标移到它上面时，我看到的是白色的文本，但看起来它根本没有样式

它是这样实现的：

import SweetAlert from 'react-bootstrap-sweetalert';
export default function LoginPage() {
    const classes = useStyles();
    const [alert, setAlert] = React.useState(null);

const warningAlert = () => {
        setAlert(
            <SweetAlert
                warning
                confirmBtnText="Try Again!"
                confirmBtnBsStyle="warning"
                btnSize="lg"
                title="Please Verify your Email and Password!"
                onConfirm={() => hideAlert()}
                onCancel={() => hideAlert()}
            >
                Something went wrong....
            </SweetAlert>
        );
    };
    const hideAlert = () => {
        setAlert(null);
    };

return (
        <div className={classes.container}>
            {alert}
            <GridContainer justify="center">

从“react bootstrap SweetAlert”导入SweetAlert；
导出默认函数LoginPage（）{
const classes=useStyles（）；
const[alert，setAlert]=React.useState（null）；
const warningAlert=（）=>{
设置警报(
hideAlert（）}
onCancel={（）=>hideAlert（）}
>
出了点问题。。。。
);
};
常量hideAlert=（）=>{
设置警报（空）；
};
返回(
{alert}

它完全按照预期工作，但就像一个白色框（ps警告图标显示良好）

有没有办法将自定义样式传递给它？我知道有一个名为“style”的参数，但我不知道如何将样式传递给它

---

谢谢！

您可以设置组件的样式，因为它支持

样式

和

自定义类

道具-

 <SweetAlert
    title="Yay!"
    customClass="containerBox" // custom css class
    style={{backgroundColor:'blue'}} // styling can be done here
    confirmBtnBsStyle="danger"
    cancelBtnBsStyle="default"
    onConfirm={this.onConfirm}
    onCancel={this.onCancel}
  >
  <span>A custom <span style={{color:'#F8BB86'}}>html</span> message.</span>

 </SweetAlert>

自定义html消息。

这就是我要找的……谢谢！