ReactToastify位置在React中不工作

Question

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 />
)
}

Answer 1

使用位置

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 />
)
}

Answer 2

必须将位置定义为ToastContainer上的prop

<ToastContainer position="bottom-right" />

Answer 3

设置位置属性

<ToastContainer position="bottom-right"/>