如何解决反应如何根据警报文本获取React-Alert调整的宽度
我不是我的应用,我正在使用react-alert
。我遇到的问题是宽度似乎是固定的,因此有文字换行。我正在尝试根据包含的警报消息的长度来调整宽度,而不是自动换行。我该怎么做?
// React Alert
import { Provider as AlertProvider } from "react-alert";
import AlertTemplate from "react-alert-template-basic";
// Alerts Options
const alertOptions = {
timeout: 5000,position: 'top center',}
ReactDOM.render(
<React.StrictMode>
<Provider store={store}>
<AlertProvider template={AlertTemplate} {...alertOptions}>
<App />
</AlertProvider>
</Provider>
</React.StrictMode>,document.getElementById("root")
);
serviceWorker.unregister();
解决方法
两种解决方法:
-
使用您自己的模板代替
react-alert-template-basic
。这是一个简单的模板文件,您可以将其保存在代码库中。您可以从react-alert-template-basic
复制除width
(设置为300px
)以外的所有内容,一切顺利。 -
继续使用
react-alert-template-basic
,但覆盖CSS。您必须使用!important
来覆盖它们,因为它们正在使用内联样式。
赞
#__react-alert__ div div div {
width: auto !important;
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。