Quiero implementar el componente de mensajes Toast. He visto algunos tutoriales sobre eso, pero no entiendo muy bien cómo agregan mensajes a la tostadora. Sé cómo hacerlo con Redux o Context API, pero ¿es posible sin ninguno de ellos? La mayoría de estos tutoriales no los usan.

En mi Toaster.jsx, podría hacer:

 const Toaster = () => { const [toasts, setToasts] = useState([]); return ( <ul> {toasts.map(({ id, message }) => ( <Toast key={id} message={message} /> ))} </ul> ); }; export default Toaster;

Y luego, en algún otro componente, me gustaría simplemente agregar brindis como este:

 <button onClick={() => toast('Hello, world!')}> Display toast </button>

¿Cuáles son las formas posibles de comunicarse con el tostador para que agregue un mensaje a su lista de mensajes? ¿Es posible sin envolver ningún componente adicional en mi aplicación?