如何仅覆盖特定通知的通知配置？

Question

我在我的React应用程序中使用react-toastify作为通知。在其配置中，我设置了默认的autoClose设置。是否有一种仅针对特定通知重写此设置的方法？请在下面找到我的当前代码。

我在索引页面中设置了react-toastify默认配置：

import { ToastContainer } from "react-toastify";
<ToastContainer
    closeButton={false}
    autoClose={6000}
/>

例如，在其他页面上，我的代码会被吹掉。在这里，我只想为特定消息为autoClose设置一个自定义配置。

    Notify({
        message: `A message`,
    });

这使用了一个名为Notify的组件：

const User = ({ message, closeToast }) => (
    <div key={0} className="notification">
        <span style={{ backgroundImage: `url('/icons/user.svg')` }}></span>
        <label dangerouslySetInnerHTML={{ __html: message }}></label>
        <button onClick={closeToast}>+</button>
    </div>
);

const Notification = (props) => {
    const { message, user } = props;
    return (
        <div>
            toast(<User message={message} />, {
                className: "white-background",
                bodyClassName: "grow-font-size",
                progressClassName: "fancy-progress-bar",
            })
        </div>
    );
};

Answer 1

根据react的文档，您可以将autoClose道具传递到to ()发射器以及ToastContainer中。

toast('My message', {autoClose: 5000});

https://fkhadra.github.io/react-toastify/introduction/