reactjs - 用 Bootstrap 4 反应 Toastify

Question

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

import { toast } from 'react-toastify'

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

需要明确的是，我正在使用以下库：

• 反应烤面包：https ://github.com/fkhadra/react-toastify
• Reactstrap：https ://reactstrap.github.io

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

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

Answer 1

您可以正常构建您的反应组件并插入它而不是普通消息。react-toastify 的文档展示了如何做到这一点。

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

更多信息在这里：https ://fkhadra.github.io/react-toastify/render-what-you-want