Позиция ReactToastify не работает в React

#reactjs #next.js #react-toastify

Вопрос:

toastify/dist/ReactToastify.css», и я не могу заставить тост отображаться в правом нижнем углу. Я использую точный код в качестве документации. Но это не работает

 import { ToastContainer, toast } from 'react-toastify';
import 'react-toastify/dist/ReactToastify.css'; 
toast.configure();

function myComponent () {
   
   ...
   const submit = () => {
       toast.success('Your Message was sent to Wasfa Team', { poistion: toast.POSITION.BOTTOM_RIGHT });
   }
   ...
   return (
     ...
     <ToastContainer />
   )
}
 

Ответ №1:

Вы должны определить позицию как опору на ToastContainer

 <ToastContainer position="bottom-right" />
 

Ответ №2:

Просто установите атрибут позиции

    <ToastContainer position="bottom-right"/>
 

Ответ №3:

просто используйте позицию

 import { ToastContainer, toast } from 'react-toastify';
import 'react-toastify/dist/ReactToastify.css'; 
toast.configure();

function myComponent () {
   
   ...
   const submit = () => {
       toast.success('Your Message was sent to Wasfa Team', { poistion: "bottom-right" });
   }
   ...
   return (
     ...
     <ToastContainer />
   )
}