使用Bootstrap 4进行 烘烤

Question

有什么方法可以将react-toastify与Reactstrap的Toast组件或Bootstrap 4 toast类一起使用？这是我当前的配置：

import { toast } from 'react-toastify'

toast.configure({
  toastClassName: 'toast', // Bootstrap class
  bodyClassName: 'toast-body', // Another Bootstrap class
});

为清楚起见，我正在使用以下库：

• React Toastify：https://github.com/fkhadra/react-toastify
• Restrap：https://reactstrap.github.io

我真的很想能够将此组件用作Toast：

• https://reactstrap.github.io/components/toasts

Answer 1

您可以像平常一样构建您的react组件并插入它，而不是简单的消息。 react-toastify的文档显示了如何做到这一点。

• 使用bootstrap 4个类/反应构建您的react toast组件引导程序
• 在应用程序中放置<ToastContainer />
• 使用toast(*)，其中*是您构建并导入到的组件应用

关于此的更多信息：https://fkhadra.github.io/react-toastify/render-what-you-want